嵌套在 ng 重复中的拼接数组

Splicing array nested within ng-repeat,

本文关键字：拼接 数组 ng 嵌套      更新时间：2023-09-26

数组的结构是这样的

  $scope.structure = {
    sections: [{
      id:0,
      sectionItems: []
    },{
      id:1,
      sectionItems: []
    },{
      id:2,
      sectionItems: []
    }]
};

我有一个嵌套的 ng-repeat，所以我可以在部分项目[] 中显示项目（里面应该是对象，其中一个键是 Name - 不相关）

<div ng-repeat="sections in structure.sections" class="col-md-12">
   <div class="panel panel-info">
    <ul class="screenW-section">
        <li class="col-xs-6" ng-repeat="item in sections.sectionItems" 
         ng-click="item.splice($index, 1)">
            {{item.Name}}
        </li>
    </ul>
</div> </div>

我希望能够在单击时删除项目，但是ng-click="item.splice（$index， 1）无论我如何格式化它都不起作用。

试试这个：

var app = angular.module("testApp", []);
app.controller('testCtrl', function($scope){
  $scope.structure = {
    sections: [{
      id:0,
      sectionItems: ['1','2','3']
    },{
      id:1,
      sectionItems: ['11','21','32']
    },{
      id:2,
      sectionItems: ['12','22','32']
    }]
};
  
  
  $scope.remove = function(sectionItems,index){
     sectionItems.splice(index, 1);     
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="testApp" ng-controller="testCtrl">
  <div ng-repeat="sections in structure.sections" class="col-md-12">
   <div class="panel panel-info">
    <ul class="screenW-section">
        <li class="col-xs-6" ng-repeat="item in sections.sectionItems" 
         ng-click="remove(sections.sectionItems,$index)">
            {{item}}
        </li>
    </ul>
</div> </div>
</div>

要删除项目，您需要将其从数组中删除。
所以，例如，你可以做 

ng-click="remove(sections.sectionItems, $index)"

在视图中，以及

$scope.remove = function(array, index) { 
  array.splice(index, 1);     
}

在控制器中...

你是在项目而不是数组上调用拼接

ng-click="sections.sectionItems.splice($index, 1)"
相关文章：