如何角編譯屬性轉換指令

Question

我希望能夠有第二個指令電話編譯提醒，我應該怎麼做這個

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

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

Answer 1

你的問題是，你是使用ng-class作爲聲明類（實例化指令）。這是行不通的，因爲ng-class添加到元素的類在編譯後被添加，並且因此不被$編譯函數識別。

更換

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/