1

親スコープからの ng-repeat によって部分的に取り込まれたディレクティブがあり、リスナーが にアタッチされていpostLinkます。ただし、コンテンツはトランスクルージョンされているため、リンク時に利用/補間されません。

実証するために 、 JSFiddle の例をまとめました。

テンプレート：

<script type="text/ng-template" id="directive.html">
        <div>list item count: {{ count }} (should be {{2 + items.length }})</div>
        <div>Transcluded content: <span ng-transclude></span></div>
</script>

<div ng-controller="Ctrl">
    <ul frag>
        <li ng-repeat="item in items">{{ item }}</li>
        <li>4</li>
        <li>5</li>
    </ul>
</div>

コード：

app.directive("frag", function ($http) {
    return {
        restrict: 'A',
        transclude: true,
        templateUrl: 'directive.html',
        link: function (scope, element, attrs) {
            scope.count = element.find("li").length;
            console.log(element);
        },
        controller: function ($scope) {
            $scope.foundB = false;
        }
    };
});

この場合、リスト アイテムの数は、トランスクルージョン後に予想される 5 ではなく、2 になります。

どうすればこれを機能させることができるか、誰にもアイデアがありますか? ある種のトランスクルード後のイベントを見つけて、そのときだけリンクを実行できると期待していましたが、見つけることができませんでした。

4

1 に答える 1

0

$timeoutダイジェスト サイクルの後に、コードを実行キューの最後に移動するために使用できます。

app.directive("frag", function ($http, $timeout) {
    return {
        restrict: 'A',
        transclude: true,
        templateUrl: 'directive.html',
        link: function (scope, element, attrs) {
            $timeout(function() {
                scope.count = element.find("li").length;
            });
        },
        controller: function ($scope, $element) {
            $scope.foundB = false;
        }
    };
});

http://jsfiddle.net/pnQyA/8/

于 2013-08-23T09:56:48.720 に答える