angular compile如何将属性转换为指令

时间:2013-05-21 16:15:45

标签: angularjs compilation attributes directive

我希望能够将第二个指令 phone 编译为警报,我该怎么做

<div ng-app="website">
    <div ng-controller="MyController">    
        <div phonebook="phone">  PhoneBook</div>
    </div>
</div>

http://jsfiddle.net/x3azn/aPWg8/1/

1 个答案:

答案 0 :(得分:1)

您的问题是您使用ng-class作为声明性类(实例化指令)。这不起作用,因为ng-class添加到元素的类在编译后添加,因此$ compile函数无法识别。

更换

var template = '<div ng-class="{phone2: number}" >Phone</div>';

使用

var template = '<div class="phone2">Phone</div>';

会使它发挥作用。

我不明白为什么你要将数字与想要实例化的phone2指令相关联,但我认为这是两件事之一:要么有条件地包含它,要么将number模型绑定到指令。如果你想创建一个有条件出现的指令,一种方法是使用ng-switch,包括它下面的指令。

但是,如果您想要创建数据绑定,则可以这样做:

var template = '<div class="phone2" data-number="number">Phone</div>';

包括对指令中绑定的引用:

.directive('phone2', function($compile){
return {
    restrict: 'AC',
    scope:{number:"="},
    link: function(s,e,a,c){

在此处发布了对代码的轻微修改:http://jsfiddle.net/aPWg8/2/