2014-10-30 67 views
1

我試圖刪除ngRepeat內的元素。它很好地移除,但在元素被移除後,頁面被重新加載。我如何防止這種重新加載操作?AngularJS刪除元素後重新加載頁面

繼承人的代碼:

<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); 
} 
+0

爲什麼會按鈕點擊重新加載頁面?你確定你有按鈕,沒有鏈接一些href,而不是表單提交? – dfsq 2014-10-30 21:02:44

+1

聽起來就像它是表單中唯一的按鈕,它假設提交。通過阻止事件的默認操作或將結束標籤移出結束標籤之外來確認它。 – Antiga 2014-10-30 21:03:29

+0

@dfsq是的,它是一個'按鈕'。 @Antiga我剛把它改成了'anchor',它工作正常!謝謝。順便說一下,它不是'form' – 2014-10-30 21:07:53

回答

4

按照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如果您好奇。

1

<button>表現得像submit(感謝@Antiga),我試圖將其更改爲input[type=button],但仍然無效。

我剛纔提出這個變化:

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

到:

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

,效果不錯。