<div>{{hoge}}</div>
↑を↓みたいにしたいとか、そういうアレね。
<div>%%hoge%%</div>
ググっても出なかったから、ソースをgrepして探した話。
>> 結論を見る
「angularjs デリミタ」でググったところ、曰く・・・
- golangテンプレートとAngularJSのデリミタがぶつかった
- Jinja2とAngularJSの変数スコープの競合を解決する方法
- Golang+Revel環境でAngularJSを使うTips
でもこれ、全部 AngularJS じゃなくて、サーバサイド側(?)のデリミタを変更してたので、要件と違うわけです。
1
まず、angular.js (concat されてて minify/aglify されてないやつ) から素直に grep
$ grep "{{" angular.js | wc -l
248
wc -l
を書いてあるけど、要するに248行ある。しかもコメント行が多かった。
2
だもんで、次にコメント行を潰す。
$ grep -v "\s*\*" angular.js | grep "{{" | wc -l
163
だいぶ減った。このあたりでまぁ、手がかりは見つかるんだけど、もうちょっとぶっ込んで見る。
3
Angular.jsのコメント行には、サンプルを生成するための HTML が書かれているので、タグっぽいのを消すのと、変数へ {{
の代入は行われているだろうということで =
を条件に加えた。
$ grep -v "\s*\*" angular.js | grep -v "\s*<" | grep "{{" | grep "=" | wc -l
8
$ grep -v "\s*\*" angular.js | grep -v "\s*<" | grep "{{" | grep "="
I can add: {{a}} + {{b}} = {{ a+b }}
I can add: {{a}} + {{b}} = {{ a+b }}
I can add: {{a}} + {{b}} = {{ a+b }}
$scope.html = 'Hello {{name}}';
denormalizeTemplate = (startSymbol == '{{' || endSymbol == '}}')
var startSymbol = '{{';
id="{{name}}"
whenExp = attr.$attr.when && element.attr(attr.$attr.when), // we have {{}} in attrs
これで、どっからどう見ても startSymbol
で検索すればわかる・・・ということがわかりますね。うん。
4
$ grep -n "var startSymbol " angular.js
7409: var startSymbol = $interpolate.startSymbol(),
10773: var startSymbol = '{{';
$interpolate
に startSymbol
メソッドがある。コレが怪しいですな。ぐぐった。
https://code.angularjs.org/1.4.7/docs/api/ng/service/$interpolate#startSymbol
5
ご丁寧に、以下のように書いてあるわけです。
Use $interpolateProvider.startSymbol to change the symbol.
コレを見に行くと、Exampleのところにやりたいことが書いてありました。
https://code.angularjs.org/1.4.7/docs/api/ng/provider/$interpolateProvider#example
結論
定義した App の config で書き換えればおk
var app = angular.module('hogeApp', []);
app.config(function($interpolateProvider) {
$interpolateProvider.startSymbol('%%');
$interpolateProvider.endSymbol('%%');
});
でもこれ、影響範囲でかすぎる気がするぞ。。。
おまけ
「angularjs delimiter」でググったところ、一発で出てきた。。。
javascript - Angular JS custom delimiter - Stack Overflow