6

2 つの別個の要素を 2 つの別個の場所にトランスクルージョンする必要があるため、angularJS でディレクティブのカスタム トランスクルージョンを実行しようとしています。

問題は、トランスクルージョンされた要素を正しいスコープで再コンパイルした後でも、トランスクルージョンされたコンテンツに引き継がれたディレクティブの中には、一部のディレクティブがng-bind機能するng-ifかどうかにかかわらず機能することです。ng-repeat

例: http://jsbin.com/menakapoma/1/edit?html,js,output

例でわかるように、両方が同じスコープにあり、同じ値にアクセスしているにもかかわらずng-bind、動作しますが動作しません。ng-if作品の真偽の状態ではありませんng-if。

これは、ng-ifディレクティブがコメントとしてトランスクルードされるためだと思いますが、トランスクルード ディレクティブの優先度を に設定9999して事前リンケージ関数で実行しても、まだ機能しません。

これらのディレクティブを機能させる方法を知っている人はいますか?

4

1 に答える 1

1

問題は、transclude関数が実行されるまでに、ネストされたディレクティブが既にコンパイルされ、コメントに置き換えられていることです。

トランスクルード オプションを完全に省略し、手動でテンプレートをリクエストすることで、これを達成することができました$templateRequest。

要素をコメント プレースホルダーに置き換えるコンパイル関数を指定して、リクエスト中に何もレンダリングされないようにします。

リンケージ関数では、テンプレートを手動でコンパイルし、ディレクティブの要素をそれに置き換えます。

ここで更新された例を参照してください: http://jsbin.com/rocedarono/3/edit?html,js,console,output

それは確かに最もクリーンで最適なソリューションのようには感じられません. 特に、$templateRequestプロミスが解決された後にDOMイベントをバインドする必要があり、$destroyイベントを削除する前に存在を確認して、事前に解決されるようにする必要があります。

于 2015-05-26T23:20:39.863 に答える