242

私はAngularJSを初めて使用します。&, @ and =適切な例でスコープを分離する場合、これらの AngularJS 演算子の違いを誰かが説明してくれますか?

4

6 に答える 6

382

@ディレクティブ属性で定義された値をディレクティブの分離スコープに渡すことができます。値は単純な文字列値 ( myattr="hello") の場合もあれば、式が埋め込まれた AngularJS 補間文字列( ) の場合もありmyattr="my_{{helloText}}"ます。親スコープから子ディレクティブへの「一方向」通信と考えてください。John Lindquist は、これらのそれぞれを説明する一連の短いスクリーンキャストを持っています。@ のスクリーンキャストはこちら: https://egghead.io/lessons/angularjs-isolate-scope-attribute-binding

&ディレクティブのisolateスコープが、属性で定義された式での評価のために親スコープに値を渡すことを許可します。ディレクティブ属性は暗黙的に式であり、二重中括弧式構文を使用しないことに注意してください。これはテキストで説明するのが難しいです。& のスクリーンキャストはこちら: https://egghead.io/lessons/angularjs-isolate-scope-expression-binding

=ディレクティブの分離スコープと親スコープの間に双方向バインディング式を設定します。子スコープの変更は親に伝播され、その逆も同様です。= は @ と & の組み合わせと考えてください。= のスクリーンキャストはこちら: https://egghead.io/lessons/angularjs-isolate-scope-two-way-binding

最後に、3 つすべてを 1 つのビューで一緒に使用したスクリーンキャストを示します: https://egghead.io/lessons/angularjs-isolate-scope-review

于 2013-02-16T13:14:10.963 に答える
24

私のフィドルではありませんが、http://jsfiddle.net/maxisam/QrCXh/は違いを示しています。重要な部分は次のとおりです。

           scope:{
            /* NOTE: Normally I would set my attributes and bindings
            to be the same name but I wanted to delineate between 
            parent and isolated scope. */                
            isolatedAttributeFoo:'@attributeFoo',
            isolatedBindingFoo:'=bindingFoo',
            isolatedExpressionFoo:'&'
        }
于 2013-02-16T07:49:49.120 に答える
5

これを本当に理解するのに非常に長い時間がかかりました。私にとっての鍵は、「@」がその場で評価され、「=」が実際にオブジェクト自体を渡す定数としてディレクティブに渡されるものであることを理解することでした。

これを説明する素敵なブログ投稿があります: http://blog.ramses.io/technical/AngularJS-the-difference-between-@-&-and-=-when-declaring-directives-using-isolate-scopes

于 2015-12-16T12:34:03.393 に答える