別のディレクティブの中からディレクティブを追加すると、ブラウザがハングします。angularjs内の別のディレクティブの中からディレクティブを追加します
は
1)は、コンパイル関数内のカスタム要素ディレクティブを(のような<h7></h7>
)アルター何をしようとしているイムです。これを行うと、ブラウザがハングします。
コード:私はこのライン//$compile(iElement)(scope);
のコメントを解除した場合
<h7>TEST</h7>
animateAppModule.directive('h7', function($compile){
return {
restrict:"E",
compile:function(tElement, tAttrs, transclude){
tElement[0].setAttribute("ng-class", "{selected:istrue}");
return function(scope, iElement, iAttrs){
//$compile(iElement)(scope);
}
}
}
})
、ブラウザがハングアップします。 上記のコメント行のコメントを外すことができます。http://jsfiddle.net/NzgZz/3/ブラウザがハングしています。
ただし、このフィドルに示すように、h7
指示文にテンプレートプロパティがあると、ブラウザがハングしていません。 http://jsfiddle.net/KaGRt/1/。達成しようとして何イム全体的に
は、私がinduvidualディレクティブの助けを借りて、新しい機能で、テンプレートをagumentしたい
です。デコレータパターンのようなもの。 私は、ディレクティブチェーン内のディレクティブのコンパイル機能の中で、このテンプレートのすべてのインスタンスに影響を与えるようにしています。
私が達成しようとしているものの擬似例。
<xmastree addBaloon addSanta></xmastree>
1)xmastreeを言うには、テンプレートがある - <div class="xmastree" ng-class={blinks:isBlinking}></div>
2)addBaloon
はテンプレートを持っていると言うの<div class="ballon" ng-class={inflated:isinflated}></div>
次に、この
<div class="xmastree" ng-class={blinks:isBlinking}>
<div ng-repeat = "ballon in ballons">
<div class="ballon" ng-class={inflated:isinflated}></div>
</div>
</div>
のようなものにSTEP1からテンプレートを補強する必要があり
addBaloon
コンパイル機能
3)addSanta
にはテンプレートがあります<div class="santa" ng-class={fat:isFat}></div>
次に、addSanta
コンパイル機能は、私は適切な特性を持つ範囲に対してSTEP3から派生したテンプレートを実行した場合、私はHTMLを得ることができる必要があり、すべてのコンパイル後、この
<div class="xmastree" ng-class={blinks:isBlinking}>
<div ng-repeat = "ballon in ballons">
<div class="ballon" ng-class={inflated:isinflated}></div>
</div>
<div ng-repeat = "santa in santas">
<div class="santa" ng-class={fat:isFat}></div>
</div>
</div>
のようなものにSTEP2からテンプレートを増大させる必要があります。
こんにちは、あなたの擬似例によると、plunk。多分それが助けになるでしょう。 http://plnkr.co/edit/ye5yqqSjyKqxTbDBckl3?p = preview – Artem
現在のdom要素で$ compileを呼び出しても、テンプレートのプロパティがないと、infinteループに入ります。ドキュメントに$ compileを実行しないという行があります。 –
これはあなたを助けます:http://www.bennadel.com/blog/2471-Delegating-Nested-Directive-Behavior-To-Parent-Directive-In-AngularJS.htm –