13

ディレクティブを使用して再利用可能な html を作成しています。HTML には、元のスコープから渡したい変数がいくつかあります。これは、ディレクティブで属性を宣言し、isolate スコープを作成してそれらをキャプチャすることで簡単に実行できます。問題は、より多くの変数に対してこれを行うためのより良い方法はありますか? のようなオブジェクトを渡し、{firstAttr: $scope.one, secondAttr: $scope.two...}このオブジェクトをバラバラにして各ピースを取得することを考えていました。これは初めて機能しますが、双方向のデータバインディングは機能しません (「=」を使用しても)。

問題は、オブジェクトの個々の部分ではなく、オブジェクトがバインドされていることです。ディレクティブでコンパイル関数を使用して、各属性を要素などに追加できますか? それで：

<mydirective databinding="{one:'first one', two:'second one'}">

次のように翻訳されます。

<mydirective one="first one" two="second one">

そうすれば、ディレクティブの属性をキャプチャすることで、データバインディングが期待どおりに機能します。その設計を達成するにはどうすればよいですか、またはこれを行うための完全に別の方法はありますか?

4

3 に答える 3

1

ディレクティブのスコープは次のように変更できます

.('mydirective ', function(){

   var linker = function(scope, element){
        console.log(scope.one, scope.two);    
   }    
   return {
        link: linker,
        scope: {one:"=", two:"="}
   }    
});
于 2013-03-21T21:27:44.037 に答える
0

問題は、より多くの変数に対してこれを行うためのより良い方法はありますか?

私はそうは思わない。すでにわかっているように、それらを 1 つのオブジェクトとして渡そうとすると、個々のパーツではなく、オブジェクトがデータバインドされます。

$compile を使用して何かを動作させることができたとしても、コードを読んでいる他の人には何が起こっているのかわかりません。

もう 1 つのオプションは、スコープを作成しない (scope: falseディレクティブの既定値である) か、新しい子スコープを作成する ( scope: true) ことですが、呼び出し元のスコープがディレクティブを使用するために特定のスコープ プロパティ名を使用する必要があることを要求します。その後、属性を指定する必要はありません。これにより、ディレクティブの使用がより制限されますが、複数の属性を指定するか、特定のスコープ プロパティ名を要求するかの 2 つの選択肢があると思います。

于 2013-03-22T04:19:44.367 に答える