Question

我从后端获得$scope.persons。我使用ng-repeat列出它。

为什么在调用$scope.openDeleteModal的情况下不会修改数组？

调用该函数但$scope.persons.为什么没有发生？

application.controller('listPersonController', function ($scope, personService) {
   personService.getPersons()
  .then(function(persons) {
      $scope.persons = persons;
  });

  $scope.openDeleteModal = function (personId, firstname, lastname, index) {
    console.log("click " + $scope.persons.length);
    $scope.persons.splice();
    console.log("click " + $scope.persons.length);
  };
});

修改：

好的，我忘记了拼接。我改用

 $scope.openDeleteModal = function (personId, firstname, lastname, index) {
    console.log("click " + $scope.persons.length);
    $scope.persons = [];
    console.log("click " + $scope.persons.length);
  };

第一个记录3.第二个0.但我没有看到范围有任何变化（ng-repeat）。

HTML：

<tbody>
   <tr ng-repeat="p in persons">
      <td>{{p.firstname}}</td>
      <td>{{p.lastname}}</td>
      <td><a href="#/register_person/{{p.id}}" class="tiny button radius" >Edit</a></td>
      <td>
        <a href="#" 
           ng-click="openDeleteModal(p.id, p.firstname, p.lastname, $index)"
           class="tiny button alert radius">Delete</a>
      </td>
   </tr>  
</tbody>

服务：

personService.getPersons = function($scope){
   var promise = $http.get("rest/person").then(function (response) {
        return response.data;
   });
   return promise;
};

这就是控制器下面的{{persons}}给出的

[{＆＃34; ID＆＃34;：＆＃34; 5331c6f33004e1c8a26492a8＆＃34;＆＃34;姓名＆＃34;：＆＃34;卡尔＆＃34;＆＃34;姓＆＃34 ;: ＆＃34; Svensson的＆＃34;}，{＆＃34; ID＆＃34;：＆＃34; 5331dfdb3004e1c8a26492ad＆＃34;＆＃34;姓名＆＃34;：＆＃34;珍妮＆＃34;＆＃34 ;名字＆＃34;：＆＃34; Bertilsson先生＆＃34;}，{＆＃34; ID＆＃34;：＆＃34; 5331ee4e3004e1c8a26492ae＆＃34;＆＃34;姓名＆＃34;：＆＃34;博斯＆＃ 34;，＆＃34;姓＆＃34;：＆＃34; Gustavsson的＆＃34;}]

当我修改范围

时，这不会改变

修改试图进一步简化内容。

application.controller('listPersonController', function ($scope, personService) {

  var personsList =  [{"id":"5331dfdb3004e1c8a26492ad","firstname":"Johnny","lastname":"Bravo"}];

  $scope.persons = personsList;

  $scope.openDeleteModal = function (personId, firstname, lastname, index) {
    console.log("click " + $scope.persons.length);
    $scope.persons.length = 0;
    personsList.length = 0;
    console.log("click " + $scope.persons.length);
  };
});

编辑：html现在非常简单

<div class="row" ng-controller="listPersonController" >
    <p ng-repeat="p in persons">{{p.firstname}} <a href="#" class="tiny button alert radius" ng-click="openDeleteModal(p.id, p.firstname, p.lastname, $index)" >Delete</a></p>
</div>

更简单。 var的值在我的页面上为3，并且在点击时不会更新。

application.controller('listPersonController', function ($scope, personService) {

  $scope.var = "1";

  $scope.openDeleteModal = function () {
    $scope.var = "2";
  };

   $scope.var = "3";
});

修改：代码从ng-view移出时按预期工作。为什么会这样？

Answer 1

从链接中删除href =“＃”，这可能导致页面导航到自身并导致控制器重新实例化。

Answer 2

splice方法在没有传递任何参数时不具有破坏性。

这意味着虽然它将返回拼接（空）数组，但它不会覆盖原始数组。

这对你意味着如果你想调用splice来清除整个数组，你应该调用：

$scope.persons = $scope.persons.splice()

虽然（没有引用javascript源代码）但我相信

$scope.persons = []

可能会更快。

请记住，这会触发一个完整的摘要周期，触发您定义的每个$watch和绑定属性。

在Angular中修改数组不起作用

2 个答案: