Wenn Sie eine Direktive aus einer anderen Direktive hinzufügen, bleibt der Browser hängen.

Was ich versuche zu tun, ist

1) Ändern Sie eine benutzerdefinierte Elementanweisung (wie<h7></h7>) innerhalb der Kompilierfunktion. Dadurch bleibt der Browser hängen.

Code:

<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);
                }
            }
        }
    })

Wenn ich diese Zeile auskommentiere//$compile(iElement)(scope);hängt der Browser. Sie können die oben genannte Zeile in dieser Geige auskommentierenhttp://jsfiddle.net/NzgZz/3/ um den Browser hängen zu sehen.

Allerdings ist der Browser hängen nicht passiert, wenn ich Vorlageneigenschaft in der habeh7 Richtlinie, wie in dieser Geige gezeigt.http://jsfiddle.net/KaGRt/1/.

Insgesamt ist das, was ich erreichen will

Ich möchte das Template mit Hilfe einzelner Direktiven mit neuen Funktionalitäten versehen. So etwas wie ein Dekorateurmuster. Ich mache dies innerhalb der Kompilierungsfunktion einer Direktive, die sich in der Direktivenkette befindet, so dass alle Instanzen dieser Vorlage davon betroffen sind.

Ein Pseudobeispiel für das, was ich erreichen will.

<xmastree addBaloon addSanta></xmastree>

1) Angenommen, xmastree hat eine Vorlage -<div class="xmastree" ng-class={blinks:isBlinking}></div>

2) SprichaddBaloon hat eine Vorlage<div class="ballon" ng-class={inflated:isinflated}></div> Dann,addBaloon Die Kompilierungsfunktion sollte die Vorlage von Schritt 1 auf etwas Ähnliches erweitern

<div class="xmastree" ng-class={blinks:isBlinking}>
    <div ng-repeat = "ballon in ballons">
        <div class="ballon" ng-class={inflated:isinflated}></div>
    </div>
</div>

3) SprichaddSanta hat eine Vorlage<div class="santa" ng-class={fat:isFat}></div> Dann,addSanta Die Kompilierungsfunktion sollte die Vorlage von Schritt 2 auf so etwas erweitern

<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>

Nach all der Kompilierung sollte ich in der Lage sein, den HTML-Code abzurufen, wenn ich die von step3 abgeleitete Vorlage mit einem Bereich mit geeigneten Eigenschaften ausführen möchte.