我的Angular控制器包含一个数组和一个删除方法
function($scope, $http){
$scope.arrayOfObjects = [];
$scope.remove = function(obj){
var i = $scope.arrayOfObjects.indexOf(obj);
if( i > -1 ){
$scope.arrayOfObjects.splice(i, 1);
}
}
// Some other things
}
HTML
<a href ng-repeat="(key, obj) in arrayOfObjects track by $index">{{obj.id}}
<button type="button" role="button" class="btn btn-default" ng-click="remove(obj)">
<i class="fa fa-trash"></i>
<span>Delete</span>
</button>
</a>
现在,当我删除除最后一个之外的对象时,一切正常。当用户按下最后一个对象的删除按钮时,页面被重定向到localhost:3000 /#,它没有映射到任何东西,我得到一个空白页面。
有没有人遇到过这样的行为?
答案 0 :(得分:0)
虽然其他答案正在解决你的链接/重定向问题,这可以通过在锚标记中没有额外的可点击项来解决,但更大的问题是你使用错误的语法来迭代数组的对象
迭代你想要的数组:
ng-repeat="obj in arrayOfObjects"
您正在使用的语法是迭代单个对象的属性。其中key
和value
是传递给转发器的参数
ng-repeat="(key, value) in object"
你最想要的是这样的东西:
<div ng-repeat="obj in arrayOfObjects">
{{obj.id}}
<button ng-click="remove(obj)">Delete</button>
</div>
答案 1 :(得分:0)
您可以使用&#39;过滤&#39;返回原始范围你想要的所有itens,就像那样:
$scope.remove = function (objs) {
$scope.objs = objs.filter(function (obj) {
//Here you remove the item you do not want
return obj;
});
};
HTML:
<button class="btn btn-danger btn-block" ng-click="remove(objs)">Delete</button>
答案 2 :(得分:0)
可以使用pop()
删除最后一个元素,并返回$scope.arrayOfObjects.pop()
angular.module('app', [])
.controller('mycontroller', function($scope) {
$scope.arrayOfObjects = [{ id: 1 }, { id: 2 }, { id: 3 }]
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="mycontroller">
<button ng-click="arrayOfObjects.pop()">remove in inline</button>
<ul>
<li ng-repeat="myobj in arrayOfObjects">{{myobj.id}}</li>
</ul>
</div>