NGリピートの要素私はNGリピートの指示項目を更新するために</strong><strong>ngのクリックで私の配列を更新しようとすると、配列の変更

Question

に更新されません：

<li ng-repeat="itemL1 in mainMenuL1Arr" 
    ng-click="selectL2menu(itemL1.name)"> 
    <i ng-class="getClass(itemL1.icon)"></i> 
</li> 

selectL2menu（）は上に定義コントローラ：

$scope.selectL2menu = function selectL2menu(itemL1name){ 
     $scope.$apply(function() { 
      $scope.mainMenuL2CurArr = $scope.mainMenuL2Obj[itemL1name]; 
     }); 
} 

右第一レベルのメニュー項目をクリックした後、それが通信員要素と第2レベルのメニューブロックを明らかにすべきである（特派値を持つ配列を更新することにより、以下を参照してください）。私の配列が正常に更新 - クリックイベントがトリガされますが

<li ng-repeat="itemL2 in mainMenuL2CurArr" 
    class="subMenuElemBlock" 
    ng-class="{active: itemL2.selected}"> 
     <a href="#"> 
      <i ng-class="getClass(itemL2.icon)"></i> 
      <span>{{itemL2.name}}</span> 
     </a> 
</li> 

：ここに は、私はクリックで更新する必要がある第二階層のメニューブロックです。それにもかかわらず、ng-repeatディレクティブは第2レベルのメニューを更新しませんでした（アレイ更新のベース）。私は$ apply関数を使って試しましたが、$ apply関数を使用していません - $ applyエラーメッセージが表示されますがError：$ apply already in progress）。

なぜ、配列がng-repeatディレクティブのメニュー要素には表示されないのですか？

私は関連記事（link、link、link）を読みましたが、実際の決定は見つかりませんでした。

Answer 1

、問題が何であるかを判断することは困難です。ここに簡略化されたworking fiddleがあります。私はあなたが持っているものと比較することをお勧めします。

$scope.$apply()に電話する必要はありません。ng-clickディレクティブが自動的にそれを行うためです。

HTML：

<ul> 
    <li ng-repeat="itemL1 in mainMenuL1Arr" ng-click="selectL2menu(itemL1.name)"> 
     {{itemL1.name}}</li> 
</ul> 
<ul style="margin-left: 20px"> 
    <li ng-repeat="itemL2 in mainMenuL2CurArr"><a href="#"> 
     <span>{{itemL2.name}}</span> 
    </a> 
    </li> 
</ul> 

はJavaScript：。

function MyCtrl($scope) { 
    $scope.mainMenuL1Arr = [ {name: 'one'}, {name: 'two'} ]; 
    $scope.mainMenuL2Obj = { 
     one: [ {name: '1.1'}, {name: '1.2'} ], 
     two: [ {name: '2.1'}, {name: '2.2'} ] }; 
    $scope.mainMenuL2CurArr = $scope.mainMenuL2Obj['one']; 
    $scope.selectL2menu = function (itemL1name) { 
     console.log(itemL1name); 
     $scope.mainMenuL2CurArr = $scope.mainMenuL2Obj[itemL1name]; 
    }; 
} 

Answer 2

はあなたにselectL2Menu機能を変更しようとしたことがあり：あなたのコントローラのコードの多くを見ることなく

$scope.selectL2menu = function (itemL1name){ 
    $scope.mainMenuL2CurArr = $scope.mainMenuL2Obj[itemL1name]; 
} 

Answer 3

あなたは$スコープを作ってみることができます$（適用）あなたは

$scope.array.push({id: 1, name: 'test'}); 
$scope.$apply(); 

作品のような配列内のアイテムを追加した後プラグインなどの別の機能を持っている可能性があります。スコープをブロックすると、私の場合はselect2とフィールドで選択した場合、適用は解雇されません。