14

パラメータとして渡された属性を AngularJS ディレクティブに評価させる良い方法はありますか?

私の問題を示す簡単な例を次に示します (ディレクティブなしでこの動作を実装できることは認識しています)。

link: function postLink(scope, element, attrs) {    
      debugger; // scope.$parent already knows the value of teacher here
      scope.sendEmail = function(){
          alert(attrs.recipient);
          //window.open("mailto:" + attrs.recipient);
      }
    }

string の代わりにteacher.email(リンク関数には の正しい値があることに注意してください)の値をディレクティブで使用したいと思います。scope.$parent.teacherteacher.email

4

1 に答える 1

22

@Ajay がコメントで既に述べたように、使用できますscope.recipient。これは、ディレクティブで分離スコープを作成したために機能します。

scope: {    
   recipient: "="
},

recipientこれにより、親スコープ プロパティに双方向でデータバインドされたという名前のディレクティブ スコープ プロパティが作成されます。どの親プロパティ？あなたの属性によって定義されたもの: recipient="teacher.email"– したがって、親スコープ プロパティteacher.emailは分離スコープ プロパティにバインドされますrecipient。

ディレクティブが の値を変更しない場合はrecipient、おそらく「=」の代わりに「@」を使用する必要があります。「@」は「一方向文字列」を提供します。

scope: {    
   recipient: "@"
},

ただし、HTML を変更する必要があります。

<sendemail recipient="{{teacher.email}}"></sendemail>

sendEmail() 関数でscope.recipientは、'=' の場合と同じように を引き続き使用できます。

代わりに使用scope: trueすると、ディレクティブは分離スコープではなく、「通常の」子スコープを作成します。次に使用するディレクティブで

scope.$eval(attrs.recipient)

値を取得します。これが機能するのは、JavaScript のプロトタイプの継承が機能するためです。$eval はプロパティteacher.emailを探しますが、ディレクティブの子スコープでは見つかりません。次に、プロトタイプ チェーンをたどって親スコープに到達し、そこで見つけます。

于 2013-03-19T18:48:42.840 に答える