删除元素后重新加载AngularJS页面

Question

我正在尝试删除ngRepeat中的一个元素。它可以很好地移除，但在移除元素之后，页面会重新加载。如何防止此重新加载操作？

代码如下：

<li ng-repeat="task in tasks">
    <p>{{task.title}}</p>
    <button ng-click="remove($index)">Click me</button>
</li>

js作用域：

$scope.remove = function($index){
    $scope.tasks.splice($index, 1);
}

Answer 1

根据W3C规范，该类型是未定义的，并且假定为提交。添加type='button'应该可以为您解决此问题。

<li ng-repeat="task in tasks">
    <p>{{task.title}}</p>
    <button type="button" ng-click="remove($index)">Click me</button>
</li>

相关的specification，如果你很好奇的话。

Answer 2

<button>表现得像个submit (多亏了@Antiga)，我试着把它改成input[type=button]，但还是不行。

我刚刚做了这样的改变：

<button ng-click="remove($index)">Click me</button>

至：

<a ng-click="remove($index)">Click me</a>

它工作得很好。