2

次のように定義されたディレクティブがあります

Application.Directives.directive('listview', function() {
    return {
        restrict: 'EAC',
        templateUrl: 'directives/listview/view.html'
    };
});

そして、このようにメインビューから含めたい

<div class="{{directiveName}}">
</div>

ここで、directiveName は「listview」と同じです。しかし、うまくいきません。以下のコードが生成されますが、listview ディレクティブは読み込まれません

<div class="listview">
</div>

それでも、上記の生成されたコードをメイン テンプレートに直接入力すると、ディレクティブが読み込まれます。どうして？どうすればそれを機能させることができますか？

4

1 に答える 1

2

だから私は方法を見つけました。あなたが望むのは、このようなものです

<div {{directiveNameInScope}}></div>

しかし、これもうまくいきません。だから私はあなたのためにそれを行うための指令を作成しました. それは次のように動作します

<div loaddirective="directiveNameInScope"></div>

loaddirective ディレクティブは次のようになります

Application.Directives.directive('loaddirective', function($compile) {
    return {
        restrict: 'A',
        scope: { loaddirective : "=loaddirective" },
        link: function($scope, $element, $attr) {
            var value = $scope.loaddirective;
            if (value) {
                // Load the directive and make it reactive
                $element.html("<div "+value+"></div>");
                $compile($element.contents())($scope);
            }
        },
        replace: true
    };
});

ここのgithubに載せました：https://github.com/willemmulder/loaddirective

于 2013-10-03T10:12:11.933 に答える