7

現在、angular でも使用したいが、アンダースコアでも使用できるようにしたい underscore.js テンプレートがあります。次のように、ディレクティブを使用して特定のスコープの補間開始記号と終了記号を変更できるかどうか疑問に思っていました。

angular.directive('underscoreTemplate', function ($parse, $compile, $interpolateProvider, $interpolate) {
     return {
         restrict: "E",
         replace: false,
         link: function (scope, element, attrs) {
             $interpolateProvider.startSymbol("<%=").endSymbol("%>");
             var parsedExp = $interpolate(element.html());
             // Then replace element contents with interpolated contents
         }
     }
 })

しかし、これはエラーを吐き出します

エラー: 不明なプロバイダー: $interpolateProviderProvider <- $interpolateProvider <- underscoreTemplateDirective

$interpolateProviderモジュール構成のみ利用可能ですか? より良い解決策は、単純に文字列置換を使用して<%=to{{および%>toに変更すること}}でしょうか?

また、 inとinをelement.html()エスケープしていることに気付きました。この自動エスケープを防ぐ方法はありますか?<<%=>%>

4

1 に答える 1

4

わかりました、ここでいくつかの問題がありますが、私はあなたのための解決策を見つけました.

デモ

http://jsfiddle.net/colllin/zxwf2/

問題1

あなたの<and>文字は and に変換されている&lt;ため&gt;、 を呼び出すと、その文字列にorelement.html()のインスタンスさえ見つかりません。<>

問題 2

$interpolateサービスはすでに によって「提供」されているため$interpolateProvider、startSymbol と endSymbol を編集できるようには見えません。 ただし、カスタムの startSymbol と endSymbol を、リンク関数で角度のある開始/終了記号に動的に変換できます。

解決

myApp.directive('underscoreTemplate', function ($parse, $compile, $interpolate) {
    return {
        restrict: "A",
        link: function(scope, element, attrs) {
            var startSym = $interpolate.startSymbol();
            var endSym = $interpolate.endSymbol();
            var rawExp = element.html();
            var transformedExp = rawExp.replace(/&lt;%=/g, startSym).replace(/&lt;%-/g, startSym).replace(/%&gt;/g, endSym);
            var parsedExp = $interpolate(transformedExp);

            scope.$watch(parsedExp, function(newValue) {
                element.html(newValue);
            });
        }
    }
});

代替案

方法はわかりませんが、 (アンダースコア タグ用に構成した後)$interpolateを使用して独自のカスタム サービスをインスタンス化する方法があると確信しています。$interpolateProvider

于 2013-10-19T00:40:01.287 に答える