4

これがどのように見えるかで、これがプランカーです

parent scope 
   ng-repeat
       directive

ディレクティブには、親スコープ内の変数との双方向バインディングである属性があります。

しかし、これは私が望んでいたように機能しません.(しかし、なぜそれが機能しないのか理解できます)

その理由は、ngRepeat が独自のスコープを作成するためです。変数がディレクティブで変更されると、Angular は ngRepeat に変数を追加しますが、親の変数は変更されません。

変数を変更するために scope.$parent.$parent.variable のようなことを行うことができますが、それは Angular の考え方ではありません。

どうすればいいですか?

また、アイテムのコレクションで繰り返しアイテムを変更すると、アイテムを変更できません。

上記と同じ理由です。

4

1 に答える 1

5

EDIT(再度):問題は、オブジェクトや配列などの参照型を配列に含める必要があるようです。

グルーピーはコメントでまさに正しかった。Angular が 2 番目のスコープのペアの間にプリミティブ型 (文字列、数値など) のコピーを作成していたように見えるため、双方向バインディングは機能していませんでした。したがって... 2 つのスコープ間で双方向にバインドされたプリミティブ型のネストがある場合は、1 つのインスタンスを使用するため問題ありませんが、複数の深さでネストすると、プリミティブのコピーが作成され、もはや同じインスタンスを更新しています。

新しいデモはこちら

app.controller('MainCtrl', function($scope) {
  $scope.items = [
    { text: 'apples' },
    { text: 'bananas' },
    { text: 'oranges' }
  ];
  $scope.addItem = function(){
    $scope.items.push({ text: 'test' });
  };
});

app.directive('test', function(){
  return {
    restrict: 'E',
    scope: {
      foo: '=foo'
    },
    template: '<div>{{foo}} <a ng-click="bar()">bar</a></div>',
    controller: function($scope){ 
      $scope.bar = function() {
        $scope.foo += '!';
      };
    }    
  };
});
于 2012-10-31T03:19:44.627 に答える