如何从angular.js数组中删除元素/节点

18 浏览
0 Comments

如何从angular.js数组中删除元素/节点

我正在尝试从数组$scope.items中移除元素,以便在视图ng-repeat="item in items"中删除元素。

仅仅为了演示,这里是一些代码:

for(i=0;i<$scope.items.length;i++){

if($scope.items[i].name == 'ted'){

$scope.items.shift();

}

}

如果视图中存在名为ted的元素,我想要移除第一个元素,对吧?这个代码可以正常工作,但是视图会重新加载所有元素,因为数组的所有键都发生了位移。这在我正在创建的移动应用中产生了不必要的延迟...

有没有人对这个问题有解决办法?

0
0 Comments

使用纯JavaScript中的Array.prototype.filter()方法可以从angular.js数组中删除元素/节点。

解决方法如下:

$scope.items = $scope.items.filter(function(item) {
    return item.name !== 'ted';
});

原因:如果想要从angular.js数组中删除元素或节点,可以使用纯JavaScript中的filter()方法。该方法会创建一个新的数组,其中包含满足指定条件的所有元素。在这个例子中,我们使用filter()方法来创建一个新的数组,其中不包含名称为'ted'的元素。

这是一种有效的方法来删除angular.js数组中的元素或节点。

0
0 Comments

在Angular.js中,从数组中删除元素/节点并没有什么复杂的操作。要从任何数组中删除元素,你需要使用splice方法:$scope.items.splice(index, 1)。下面是一个示例:

HTML:

  • {{item}}

JavaScript:

"use strict";

var demo = angular.module("demo", []);

function DemoController($scope){

$scope.items = [

"potatoes",

"tomatoes",

"flour",

"sugar",

"salt"

];

$scope.addItem = function(item){

$scope.items.push(item);

$scope.newItem = null;

}

$scope.removeItem = function(index){

$scope.items.splice(index, 1);

}

}

在上述代码中,$scope.items.splice(index, 1)的意思是从数组中删除一个元素,该元素的位置是index。

在删除元素时要注意,$index并不一定与$scope.items的索引一致,特别是当使用orderBy或filter时。一般不建议使用$index,因为它在不同情况下的表现可能不一致。

有人问到有什么替代方案,我记得我使用了bpaul的解决方案,具体可以参考stackoverflow的回答:stackoverflow.com/a/22160628/1529346

0
0 Comments

问题的原因是用户想要从Angular.js数组中删除元素/节点,但不清楚如何实现。解决方法是使用$filter来过滤数组并删除指定元素。以下是解决方法的详细内容:

对于任何回答这个问题的人,请使用“Angular Way”来从数组中删除项目,可以通过将$filter注入到控制器中,并执行以下操作:

$scope.items = $filter('filter')($scope.items, {name: '!ted'})

不需要加载任何其他库或使用JavaScript原始类型。

如果你有一个名为“ted”和“teddy”的元素,并且只想要删除“ted”元素,可以在末尾使用true:

$filter('filter')($scope.items, {name: '!ted'}, true)

具体参考[docs.angularjs.org/api/ng/filter/filter](https://docs.angularjs.org/api/ng/filter/filter)

如果你想要删除包含特定数字id的元素,可以使用$filter来查找元素,但我还没有找到否定它的方法,因为{ id: "!42" }是一个字符串而不是数字。但是以下方法可以实现:

$filter('filter')($scope.items, function(value, index) {return value.id !== 42;});

尽管这个答案的“Angular-ness”更高,但与splice方法相比,可读性和可用性都要低得多。

0