1

angularjsディレクティブのコンパイルを防ぐことができるかどうか知りたかっただけですか?

jQuery Slick Grid プラグインを使用して Web サイトにいくつかのデータグリッドを表示し、HTML を含むネストされたディレクティブを使用してセル テンプレートを簡単に定義する方法を想像しました。

問題は、この HTML コードがテンプレートとして使用されることを意図しているのに、グリッドが初期化される前に AngularJS がそれをコンパイルすることです! (一見論理的ですが...)

前もって感謝します ！

編集:これは私のディレクティブの例です。

<div class="datagrid" my-datagrid="o in collection">
    <div my-datagrid-column="col1">
         <div>{{o.col1}}</div>
    </div>
    <div my-datagrid-column="col2">
         <div custom-directive-with-transclusion="foobar">{{o.col2}}</div>
    </div>
</div>

これが、グリッドの各列を記述するmy-datagridいくつかを含む親ディレクティブです。my-datagrid-columnこれらのmy-datagrid-columnディレクティブ ノードのそれぞれには、レンダリング時にグリッド セルのテンプレートとして使用される HTML コンテンツが含まれています。

問題は、エンジンが「認識」してコンパイルし、ディレクティブが Datagrid を作成する前にcustom-directive-with-transclusionディレクティブをトランスクルードすることです。my-datagrid

したがって、私のdatagrid-columnディレクティブは、既にコンパイルされたセルの「テンプレート」を取得します...そして、私はそれを望んでいません。サービスを使用して各セルを自分でコンパイルしたいのです$compile。

多分それはそれを行う方法ではないかもしれません、多分私は完全に間違った方法で進んでいます. Javascriptコントローラーでセルテンプレートを醜い引用符で囲み、次のようにすべてエスケープすることを避けたいだけです。

template[0] = '<div>this is my ugly template {{myCol1}} of my first column</div>';
template[1] = '<div>this is my ugly template {{myCol2}} of the 2nd column</div>';
4

2 に答える 2

0

2 つのオプション:

  1. {{}} を使用する代わりに、別の記号を使用してこれらを表します。Angularjs はそれらを無視します。ディレクティブで、シンボルを検索して {{}} に置き換えます。

  2. 角度テンプレート文字列のワンオフレンダリングをご覧ください。この手法を使用して角度ディレクティブをセルに配置しましたが、うまく機能します。

幸運を。

于 2014-02-22T17:18:19.307 に答える
0

リンクが完了した後にコンパイル プロセスを停止することはできませんが、要素を DOM から取り出すことができます (要素のリンクを解除すると、コンパイル プロセスが妨げられます)。ng-if ディレクティブとまったく同じように、ここで ng- if コード: https://github.com/angular/angular.js/blob/master/src/ng/directive/ngIf.js

于 2015-11-30T22:33:16.167 に答える