0

2 番目のディレクティブphoneをアラート用にコンパイルできるようにしたいのですが、どうすればよいですか?

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

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

4

1 に答える 1

1

あなたの問題は、(ディレクティブをインスタンス化するために) 宣言クラスとして ng-class を使用していることです。ng-class が要素に追加するクラスはコンパイル後に追加され、 $compile 関数によって認識されないため、これは機能しません。

交換する

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

と

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

それを機能させます。

インスタンス化したい phone2 ディレクティブに番号を関連付けた理由はわかりませんでしたが、条件付きで含めるか、numberモデルをディレクティブにバインドするかのいずれかだと思います。条件付きで表示されるディレクティブを作成する場合、1 つの方法は、その下のディレクティブを含めて 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/

于 2013-05-21T16:46:38.067 に答える