1. ホーム
  2. javascript

[解決済み] angular ディレクティブは、ディレクティブの属性で指定された式で関数に引数を渡すことができますか?

2022-04-25 20:17:07

質問

フォームディレクティブで、指定した callback 属性に、分離されたスコープを設定します。

scope: { callback: '&' }

の中に入っています。 ng-repeat を含むので、私が渡す式は id をコールバック関数の引数として指定します。

<directive ng-repeat = "item in stuff" callback = "callback(item.id)"/>

ディレクティブを書き終えると、それは $scope.callback() をコントローラ関数から実行します。ほとんどの場合、これで問題ありませんし、やりたいこともこれだけなのですが、時には directive を使用します。

これを可能にするようなangular表現はないでしょうか。 $scope.callback(arg2) となり、結果として callback で呼び出される。 arguments = [item.id, arg2] ?

そうでない場合、最もすっきりした方法は何でしょうか?

これが有効だということがわかりました。

<directive 
  ng-repeat = "item in stuff" 
  callback = "callback" 
  callback-arg="item.id"/>

とともに

scope { callback: '=', callbackArg: '=' }

を呼び出すディレクティブと

$scope.callback.apply(null, [$scope.callbackArg].concat([arg2, arg3]) );

しかし、特にすっきりしたとは思いませんし、isolateスコープに余計なものを入れてしまうことになります。

何か良い方法はないでしょうか?

プランカー・プレイグラウンドはこちら (コンソールを開いておく)。

解決方法は?

lex82 の言うようにコールバックを宣言すると

callback = "callback(item.id, arg2)"

ディレクティブスコープでコールバックメソッドをオブジェクトマップで呼び出せば、正しくバインドされます。のように

scope.callback({arg2:"some value"});

を使用すると、$parse を必要としません。私のfiddle(コンソールログ)を見てください。 http://jsfiddle.net/k7czc/2/

更新情報 : の中に小さな例があります。 ドキュメント :

& または &attr - のコンテキストで式を実行する方法を提供します。 親スコープ attr名を指定しない場合、属性名 はローカル名と同じとみなされる。与えられた、ウィジェットのスコープの定義。{ localFn:'&myAttr' }とすると、スコーププロパティlocalFnが指すのは を表す関数ラッパーです。よくあること 分離されたスコープから式を介してデータを渡すことが望ましいです。 と親スコープに渡すことができます。 変数名と値を式ラッパーのfnに渡します。 例えば 式がincrement(amount)である場合、amountを指定することができます。 の値は、localFn({amount: 22})のようにlocalFnを呼び出すことで得られます。