0

分離スコープを使用してディレクティブに変数を渡すことは、同じディレクティブの異なるインスタンス化に対して同じように機能しないことがわかりました。

たとえば、任意のデータを取得して単純なテンプレートに表示する基本的なディレクティブは次のとおりです。

var module = angular
    .module('myModule', [])
    .directive('isolatedScopeDirective', function() {
        return {
            restrict: 'CA',
            template: '<div>data: {{data}}</div>',
            scope: {
                data: '='
            }
        };
    });

そして、クラスを介して1回、アノテーションを介して1回インスタンス化するマークアップを次に示します。

<body ng-app='myModule' ng-init='anArray=[1,2,3]'>
    <h1>Directive using class:</h1>
    <div class='isolatedScopeDirective' data='anArray'></div>

    <h1>Same directive using annotation:</h1>
    <div isolated-scope-directive='{{data=anArray}}'></div>
</body>​​​​​​​​​​​​​​​​​

これから得られる結果は次のとおりです。

Directive using class:
data: [1,2,3]

Same directive using annotation:
data:

(自分で確認してください:http://jsfiddle.net/Prnbe

ディレクティブからscopeプロパティを削除すると、つまり、分離されたスコープの使用を停止すると、どちらの場合もデータは正しく渡されます。私にとって、これは私の設定が正しく、分離されたスコープのクラスまたはアノテーションの処理が壊れていることを示しています。

Am I doing something wrong? Or is this a bug in AngularJS?

4

1 に答える 1

3

Based on how you have the code setup, I believe your attribute usage should look like this instead:

<div isolated-scope-directive data='aString'></div>

This:

<body ng-app='myModule' ng-controller='myController'>
    <h1>Directive using class:</h1>
    <div class='isolatedScopeDirective' data='aString'></div>
    <br/>
    <h1>Same directive using annotation:</h1>
    <div isolated-scope-directive data='aString'></div>
</body>​​​​​​

Outputs:

Directive using class:
data: test

Same directive using annotation:
data: test
于 2012-12-09T21:26:42.930 に答える