Bagaimana cara menghapus item dari array di lingkup AngularJS?

Agenda yang harus dilakukan, tetapi dengan tombol hapus pada halaman daftar untuk setiap item:

HTML templat yang relevan:

<tr ng-repeat="person in persons">
  <td>{{person.name}} - # {{person.id}}</td>
  <td>{{person.description}}</td>
  <td nowrap=nowrap>
    <a href="#!/edit"><i class="icon-edit"></i></a>
    <button ng-click="delete(person)"><i class="icon-minus-sign"></i></button>
  </td>
</tr>

Metode pengontrol yang relevan:

$scope.delete = function (person) {
  API.DeletePerson({ id: person.id }, function (success) {
    // I need some code here to pull the person from my scope.
  });
};

Saya mencoba $scope.persons.pull(person)dan $scope.persons.remove(person).

Meskipun database berhasil dihapus, saya tidak bisa menarik item ini dari ruang lingkup dan saya tidak ingin membuat panggilan metode ke server untuk data yang sudah dimiliki klien, saya hanya ingin menghapus orang ini dari ruang lingkup.

Ada ide?

Masalah Anda sebenarnya bukan dengan Angular, tetapi dengan metode Array. Cara yang tepat untuk menghapus item tertentu dari array adalah dengan Array.splice. Juga, ketika menggunakan ng-repeat, Anda memiliki akses ke $indexproperti khusus , yang merupakan indeks saat ini dari array yang Anda lewati.

Solusinya sebenarnya cukup mudah:

Melihat:

<a ng-click="delete($index)">Delete</a>

Pengendali:

$scope.delete = function ( idx ) {
  var person_to_delete = $scope.persons[idx];

  API.DeletePerson({ id: person_to_delete.id }, function (success) {
    $scope.persons.splice(idx, 1);
  });
};

Anda harus menemukan indeks persondalam personsarray Anda , lalu gunakan metode array splice:

$scope.persons.splice( $scope.persons.indexOf(person), 1 );

Saya akan menggunakan perpustakaan Underscore.js yang memiliki daftar fungsi yang berguna.

without

without_.without(array, *values)

Mengembalikan salinan array dengan semua instance nilai yang dihapus.

_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
// => [2, 3, 4]

Contoh

var res = "deleteMe";

$scope.nodes = [
  {
    name: "Node-1-1"
  },
  {
    name: "Node-1-2"
  },
  {
    name: "deleteMe"
  }
];
    
$scope.newNodes = _.without($scope.nodes, _.findWhere($scope.nodes, {
  name: res
}));

Lihat Demo di JSFiddle .

filter

var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });

// => [2, 4, 6]

Contoh

$scope.newNodes = _.filter($scope.nodes, function(node) {
  return !(node.name == res);
});

Lihat Demo di Fiddle .

$scope.removeItem = function() {
    $scope.items.splice($scope.toRemove, 1);
    $scope.toRemove = null;
};

ini bekerja untuk saya!

Jika Anda memiliki fungsi yang terkait dengan daftar, ketika Anda membuat fungsi sambatan, asosiasi tersebut juga dihapus. Solusi saya:

$scope.remove = function() {
    var oldList = $scope.items;
    $scope.items = [];

    angular.forEach(oldList, function(x) {
        if (! x.done) $scope.items.push( { [ DATA OF EACH ITEM USING oldList(x) ] });
    });
};

Param daftar bernama item . Param x.done menunjukkan jika item tersebut akan dihapus.

Referensi lain: Contoh lain

Semoga bisa membantu Anda. Salam pembuka.

Untuk jawaban yang diterima dari @Joseph Silber tidak berfungsi, karena indexOf mengembalikan -1. Ini mungkin karena Angular menambahkan hashkey, yang berbeda untuk $ scope.items [0] saya dan item saya. Saya mencoba menyelesaikan ini dengan fungsi angular.toJson (), tetapi tidak berhasil :(

Ah, saya menemukan alasannya ... Saya menggunakan metode chunk untuk membuat dua kolom di meja saya dengan menonton $ scope.items saya. Maaf!

Anda juga bisa menggunakan ini

$scope.persons = $filter('filter')($scope.persons , { id: ('!' + person.id) });

Angular memiliki fungsi bawaan yang disebut arrayRemove, dalam kasus Anda metode ini dapat berupa:

arrayRemove($scope.persons, person)

array.splice(array.pop(item));

Untuk menghapus elemen dari ruang lingkup gunakan:

// remove an item
    $scope.remove = function(index) {
        $scope.items.splice(index, 1);
    };

Dari masukkan uraian tautan di sini