1

特定の html をディレクティブ テンプレートの特定の場所に移動するために使用するカスタム トランスクルージョン関数があります。現在のトランスクルージョン機能は素晴らしいものの、物を 1 つの場所にしかドロップできないという制限があります。さまざまな領域に移動する必要があるさまざまな部分があります。これが私のセットアップです:

<div ng-app="app">
    <div ng-controller="ParentCtrl">
        <div class="parentDirectiveRepeat" data-list="myList">
            <div data-transclude-ipsum>Ipsum</div>
        </div> 
        <hr>
        <div class="parentDirectiveNoRepeat" data-list="myList">
            <div data-transclude-ipsum>Ipsum</div>
        </div>
    </div>
</div>

そして、これが私の 2 つのディレクティブ テンプレートです。

parentDirectiveRepeat: <div>Parent Directive<div data-ng-repeat="item in list">repeater<div data-transclude-ipsum-destination></div></div></div>
parentDirectiveNoRepeat: <div>Parent Directive<div data-transclude-ipsum-destination></div></div>

そして、それらの両方の間で共通に共有されるコントローラー:

function directiveController($scope, $element, $transclude, $compile){
    var ipsumDestination = angular.element($element[0].querySelectorAll("div[data-transclude-ipsum-destination]"));

    $transclude(function(clone){
        var ipsum = csFncFindElement(clone, "data-transclude-ipsum");
        ipsumDestination.append(ipsum);
    });   
}

したがって、出力は次のとおりです。

Parent Directive
repeater
repeater
repeater
-------------
Parent Directive
Ipsum

問題は、出力が実際には

Parent Directive
repeater
ipsum
repeater
ipsum
repeater
ipsum
-------------
Parent Directive
Ipsum

プロセス全体のjsFiddleは次のとおりです: http://jsfiddle.net/uBsbC/1/

さまざまなテストを通じて、 $transclude 関数を使用しているときに data-ng-repeat がすでに接続されて終了していることを確認しました。この親ディレクティブが通過するまで、子供を配線させずに待つように指示する方法はありますか?

4

0 に答える 0