如何不引用控制器作为指令

时间:2015-10-16 00:44:50

标签: angularjs

以下是描述问题的最小代码。在页面上,我有:

<div ng-controller='AController as a'>
    <div a-directive></div>
</div>

在js中,我有:

app.directive("aDirective", function($compile){
    return {
        scope: true,
        link: function(scope, element, attrs) {
            var template = "<h1>{{a.label}}</h1>";
            element.append($compile(template)(scope));
        }
    }
});

app.controller("AController", function($scope){
    self = this;
    self.label = "some text";
});

这是有效的,但问题是{{a.label}},它使视图和控制器/模型紧密耦合。有没有办法摆脱那个。,更不用说指令代码中的controllerAs-name了? (就像我在控制器代码中所做的那样)

1 个答案:

答案 0 :(得分:1)

要改进此功能,您可以传递文本作为指令的参数显示。这样的事情是最初的想法:

<div a-directive="a.label"></div>

但是,我建议使用控制器的别名,所以我制作了一个Plunker,你可以看到所有这些都有一些改进。

请在此处查看:http://plnkr.co/edit/1hBSBxwSEPXoj9TULzRQ?p=preview

我还建议使用template代替link并将指令限制为元素而不是将其用作属性,因为它正在修改DOM。但是,是的,你可以继续改进它直到时代的结束:)