Question

你好我是AngularJS的新手，我想我误会了什么。我试图在另一个指令模板中动态注入一个指令。

例如，我有2个指令“a-tag”和“b-tag”，我想在另一个指令“container”中添加这两个指令中的一个。

我有这样的事情：

<body ng-app="myApp">
    <container item="a-tag" a-color="#f00"></container>
</body>

我声明了我的“容器”指令以获取item属性（a-tag，b-tag或任何其他指令）并将其注入。

angular.module("Container", []).directive("container", function($compile){
    return {
        restrict: "EA",
        scope: {
            item: "@"
        },
        link: function(scope, element, attrs){
            var template = '<div id="container">';
            var item = '';
            if(scope.item !== undefined){
                item = '<' + scope.item;
                item += ' ></' + scope.item + '>';
            }
            template += item + '</div>';
            element.html(template);
            $compile(element.contents())(scope);
        }
    };
});

它正在工作，但我知道如何向我的孩子指令（a / b等）广播他的属性（例如a-color =“＃f00”，就像在第一段代码中使用的那样）。

我的孩子指令看起来像这样：

angular.module("A", []).directive("aTag", function(){
   return {
       restrict: "EA",
       templateUrl: "template/a.html",
       replace: true,
       link: function(scope, element, attrs){
           element.css("color", attrs.bColor);
       }
   };
});

这是一个简单的例子。实际上我设计了一个模态弹出窗口（我的容器），我想用它来做几件事，比如显示一个表单，一个加载器（我的指令是a-tag，b-tag等）。

欢迎任何想法。

泰，

雷米

在另一个指令模板内动态注入指令

0 个答案: