为什么从 Angular 服务中的对象中删除此元素不起作用

Why removing this element from an object inside an Angular service doesn't work?

本文关键字:删除 元素 不起作用 对象 Angular 服务 为什么      更新时间:2023-09-26

我正在使用Angularjs创建一个应用程序,并且我正在尝试使用对象作为数组容器;所以我有objects->array->objects。我知道,我可以改用数组作为容器,但它似乎无法以这种方式正常工作。我有一个包含对象的服务,以及两种添加和删除条目的方法。添加效果很好,但删除不起作用,即使我查看控制台并且输出为($log.log(删除人员[人]);)..

var app = angular.module('app', []);
  app.controller('appController', function($log, $scope, MyService){
    $scope.users = MyService.getPersons();
    $scope.addEntry = function(){
      MyService.addEmail($scope.newPerson, $scope.newEmail);
    };
    $scope.deleteEntry = function(){
      MyService.deleteEmail($scope.personDelete);
    };
  });
  
  angular.module('app').service('MyService', function($log){
    var persons = {};
    this.addEmail = function(person, email){
      persons[person] =  persons[person]? persons[person] : []; 
      persons[person].push({id: email});
    };
    this.deleteEmail = function(person){
        //$log.log(delete persons[person]); <-- it's true!
      delete persons[person];
    };
    this.getPersons = function(){
      return persons;
    };
});

这是普伦克

https://plnkr.co/edit/yElSTpo4lsKz1VnIIGRx?p=preview

TD 元素上的 ngModel 没有意义,也没有任何作用。只需将person对象传递给 deleteEntry 方法:

  <tbody ng-repeat="(person, emails) in users">
    <tr ng-repeat="email in emails">
      <td>{{person}}</td>
      <td>{{email.id}}</td>
      <td>
        <button ng-click="deleteEntry(person)">delete</button>
      </td>
    </tr>
  </tbody>

在控制器中:

$scope.deleteEntry = function(person) {
    MyService.deleteEmail(person);
};

演示:https://plnkr.co/edit/q7HF4aaRGh0Cxq7yWqZz?p=preview