帶有按鈕單擊事件的奇怪Angular 2行為

Question

我的.ts文件中有兩個非常簡單的方法：

editLocation(index) {}

deleteLocation(index) { 
    this.locations.splice(index, 1); 
}

當單擊按鈕時，html對應對象將調用以下方法：

<button (click)="editLocation(i)" class="btn btn-xs btn-success">Edit</button>
<button (click)="deleteLocation(i)" class="btn btn-xs btn-danger">Delete</button>

“刪除”按鈕可以正常工作，快速刪除我需要的內容並顯示“位置”的更新列表。 現在，使用“編輯”按鈕，我想實現其他行為。 但是，無論我在該方法中放入什么內容，在執行代碼后，它都會花一點時間並重定向到上一頁。 我從edit方法中刪除了所有內容（如上所示，現在為空），它仍然重定向到上一頁。 但是，如果我添加this.locations.splice(index, 1); 到“編輯”方法，它的行為就像“刪除”方法一樣，並且不會重定向到任何地方。 有什么事嗎 在此先多謝！

Answer 1

您可以向其中添加type =“ button”，以確保該按鈕不充當提交或其他事件：

<button type="button" (click)="editLocation(i)" class="btn btn-xs btn-success">Edit</button>