ng-repeatメソッドがng-clickメソッドから呼び出されたときにリフレッシュされない

Question

複合階層データを表示する再利用可能なディレクティブの作成に取り組んでいます。

「サーバー」/「ソフトウェア」/「マザーボード」（ng-repeatにバインドされたアイテム配列）のようなカテゴリが表示されます。ユーザーが「サーバー」をクリックすると、「Ser1」/「Ser2」/「Ser3」のような使用可能なサーバーが表示されます。

html : 

     <div ng-app="myApp" ng-controller="myCtrl" ng-init="init()"> 
     <ul> 
      <li ng-repeat="item in items"> 
       <div my-dir paramitem="item"></div> 
       </li> 
     </ul> 
     </div> 

最初にアイテムがロードされていますが、アイテムをクリックしてもng-repeatがリフレッシュされません。私は、下のコントローラ、メソッドで "サブItemClick"をクリックしてチェックして、それが解雇されている。ただし、アイテムのコレクションはリフレッシュされません。

http://plnkr.co/edit/rZk9cbEJU90oupVgcSQt

Controller: 

    var myApp = angular.module('myApp', []); 

    myApp.controller('myCtrl', ['$scope', function($scope) { 
     $scope.init = function() { 
      $scope.items = [{iname: 'server',subItems: ['ser1', 'ser2','ser3']} 
      ]; 
     }; 

     $scope.subItemClick = function(sb) { 
      if (sb.subItems.length > 0) { 
      var zdupitems = []; 
      for (var i = 0; i < sb.subItems.length; i++) { 
       zdupitems.push({ 
       iname: sb.subItems[i], 
       subItems: []    
       }); 
      } 
      $scope.items = zdupitems; 
    } 
     }; 

     }]) 
     .directive('myDir', function() { 
     return { 
      controller: 'myCtrl', 
      template: "<div><a href=# ng-click='subItemClick(paramitem)'>{{paramitem.iname}}</a></div>", 
      scope: { 
      paramitem: '=' 
      } 
      } 
     }); 

私はSER1/SER2のような項目は、「サーバー」をクリックしますが、それは起きていない上ngのリピートに拘束されることに期待しています。

助けが必要ですか？

Answer 1

私はonClickがメソッドの$ scopeの定義を台無しにしていると思います。そのコンテキストでは、ngRepeatをレンダリングする$ scopeは実際には$ scope。$ parentです（$ scope。$ parentは使用しないでください）。間違った$ scopeに新しいitems配列を作成しています。

私はjsfiddleがあなたが扱っているもののおそらくダンピングされた例であることを認識していますが、それは間違ったアプローチです。グローバル値を使用する必要がある場合は、注入されたサービスからその値を取得して、あるコンポーネントが値をリセットして新しい値がどこにでも反映されるようにする必要があります。 またはあなたは別の指令のonClick要素を置くことができません。その価値は何ですか？