How can I change the Handlebars syntax to differentiate from the Angular template syntax?

问题

I'm using Handlebars to do client side preprocessing of dynamic templates for an Angular app. I require the Handlebars process to render some Angular mark up that contains {{ this notation }} that is for the angular templating engine as opposed to the Handlebars templating engine.

{{This is a Handlebars expression that contains an {{Angular expression}}...}}

Is there a syntax for differentiating between Handlebars and Angular's double curly brace notation here? I don't want to change the syntax for Angular as I have a large amount of code dependent on that syntax. Can I adapt the Handlebars syntax?

回答1:

The syntax in Igor Raush's answer is specific to Moustache. Handlebars doesn't support this functionality.

Handlebars does allow you to escape a single line with and backslash before the curly braces. But you wont find this in their documentation for some reason.

This doesn't address the edge case of nested expressions in the question but is the closest I could get to solving the issue and might prove useful to people facing a similar problem.

Here is an example:

<div>{{thisWillBeProcessedByHandlebars}}</div>

<div>\{{ThisWontBeProcessedByHandlebars}}</div>

回答2:

You can change either Handlebars or Angular template delimiters:

Angular

First (global setting)

app.config(['$interpolateProvider', function($interpolateProvider) {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
}]);

then

<% This is an AngularJS expression that contains a {{ Handlebars expression }} %>

Handlebars

{{=<% %>=}}  // this kind of thing can be done as many times as needed
{{ This is an AngularJS expression that contains a <% Handlebars expression %> }}

来源：https://stackoverflow.com/questions/31601499/how-can-i-change-the-handlebars-syntax-to-differentiate-from-the-angular-templat

标签

angularjs

handlebars.js