无法在 AngularJS 的重复方法中删除答案

【问题标题】：Not able to delete in repeat method in AngularJS无法在 AngularJS 的重复方法中删除
【发布时间】：2016-11-22 13:11:25
【问题描述】：

“删除选择”不起作用。这里有两个函数addNewChoice 和removeChoice。 addNewChoice 工作但 removeChoice 不工作。我不知道如何解决它。我的代码如下：

<?php $obj = 1;?>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js">
</script>
<script type="text/javascript">
     var app = angular.module('shanidkvApp', []);
     app.controller('MainCtrl', function($scope) 
     {
          $scope.choices = [{id: 'choice1'}];
          $scope.addNewChoice = function() 
          {
               var newItemNo = $scope.choices.length+1;
               $scope.choices.push({'id':'choice'+newItemNo});
          };

          $scope.removeChoice = function(index) 
          {
               var lastItem = $scope.choices.length-1;
               $scope.choices.splice(index,1);
          };

    });   
</script>
<%--here is my html --%>
<div class="btn btn-primary"  ng-show="$last" ng-click="removeChoice()">Remove</div>

【问题讨论】：

index 在函数中未定义。

标签： html angularjs angularjs-scope

【解决方案1】：

如果您只想删除数组中的最后一项，您可以简单地使用Array.prototype.pop()

$scope.removeChoice = function(){                 
    $scope.choices.pop();
};

【讨论】：

【解决方案2】：

看来您应该使用 lastItem 来删除和移除索引参数

 $scope.removeChoice = function() 
 {
    var lastItem = $scope.choices.length-1;
    $scope.choices.splice(lastItem,1);
 };

【讨论】：

【解决方案3】：

您没有在 ng-click 中的 removeChoice 函数中传递索引。您需要在此函数中传递项目的索引 -

<div class="btn btn-primary"  ng-show="$last" ng-click="removeChoice(index)">Remove</div>

您可以从 ng-repeat 循环中获取索引。

或者，如果您想始终删除最后一项，则不需要在函数中传递索引键。但是你需要改变你的功能如下 -

$scope.removeChoice = function(index) 
        {
             var lastItem = $scope.choices.length-1;
             $scope.choices.splice(lastItem,1);
        };

【讨论】：

ng-repeat 中有$index，但没有index
你可以在 ng-repeat 中获取索引为 ng-repeat="(index,friend) in friends"
好吧，你没有表现出来。如果 OP 要尝试使用 index，正如您所展示的那样没有其他修改，它将无法工作
请在此处分享您的 ng-repeat 代码。以便我了解您的渲染方式。

【解决方案4】：

     var app = angular.module('shanidkvApp', []);
     app.controller('MainCtrl', function($scope) 
     {
          $scope.choices = [{id: 'choice1'}];
          $scope.addNewChoice = function() 
          {
               var newItemNo = $scope.choices.length+1;
               $scope.choices.push({'id':'choice'+newItemNo});
          };

          $scope.removeChoice = function() 
          {
            console.log($scope.choices);
               var lastItem = $scope.choices.length-1;
               $scope.choices.splice(lastItem,1);
            console.log($scope.choices);
          };

    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!--here is my html -->
<body ng-app="shanidkvApp" ng-controller="MainCtrl">
<div class="btn btn-primary"  ng-click="removeChoice()">Remove</div>
  <div class="btn btn-primary" ng-click="addNewChoice()">Add</div>
  <p></p>
</body>

【讨论】：