如何NG重複索引發送到另一個NG-重複

Question

我有一個數組呼叫「菜單」

var Menu = [ 
     "url" : "#", 
     "type" : "F", 
     "id" : "F00001", 
     "name" : "CUST", 
     "child" : [ { 
      "type" : "P", 
      "id" : "C00001", 
      "name" : "CUST INFO" 
     }, { 
      "type" : "P", 
      "id" : "C00002", 
      "name" : "CUST BACKGROUND" 
     } ] 

當TopMenuBar點擊「CUST」我希望選擇標誌可以把另一個NG重複這樣的代碼下面

<div id"TopMenuBar">  
    <ul> 
     <li ng-repeat="row in Menu" > 
      <a ng-click="row.type == 'P' ? GeneratePage({'txnName':row.name,'txnId':row.id,'txnPath':[row.name],'txnURL':[row.url]}) : angular.noop >{{row.name}}</a></span> 
     </li> 
    </ul> 
</div> 
<div id="sideMenuContainer"> 
    <ul> 
     <li ng-repeat="row2 in Menu[index].child" > 
      <a ng-click="row.type == 'P' ? GeneratePage({'txnName':row2.name,'txnId':row2.id,'txnPath':[row2.name],'txnURL':[row2.url]}) : angular.noop >{{row2.name}}</a></span> 
     </li> 
    </ul> 
</div> 

感謝您的回答

Answer 1

您無法訪問重複容器外部的ng-repeat的索引。爲了您在click事件上的目的，您只需傳遞該對象並將重複對象設置爲傳遞的對象，如下所示。

在ng-repeat語句中添加單擊事件並將該對象傳遞給該方法。

<div id"TopMenuBar">  
    <ul> 
     <li ng-repeat="row in Menu" ng-click="selectMenu(row)"> 
      <a ng-click="row.type == 'P' ? GeneratePage({'txnName':row.name,'txnId':row.id,'txnPath':[row.name],'txnURL':[row.url]}) : angular.noop >{{row.name}}</a></span> 
     </li> 
    </ul> 
</div> 

控制器內部定義事件作爲

$scope.selectMenu = function(menu) { 
    $scope.selectedMenu = munu; 
} 

對於第二NG-repeat選項將其定義爲

<div id="sideMenuContainer"> 
    <ul> 
     <li ng-repeat="row2 in selectedMenu.child" > 
      <a ng-click="row.type == 'P' ? GeneratePage({'txnName':row2.name,'txnId':row2.id,'txnPath':[row2.name],'txnURL':[row2.url]}) : angular.noop >{{row2.name}}</a></span> 
     </li> 
    </ul> 
</div> 

在重複語句中的selectedMenu會在所選菜單第一次重複聲明。希望這會對你有用

Answer 2

嘗試這樣的：

<div class="container1"> 
    <ul> 
     <li ng-repeat="menu in menus track by $index"> 
      <a ng-click="child($index)">{{menu.name}}</a> 
     </li> 
    </ul> 
</div> 
<div class="container1"> 
    <ul> 
     <li ng-repeat="menu in menus2 track by $index"> 
      <a>{{menu.name}}</a> 
     </li> 
    </ul> 
</div> 

$scope.child = function(index) { 
    $scope.menus2 = $scope.menus[index].child; 
}