我想警告用戶未保存的更改，然后再離開我的angular 2應用程序的特定頁面。通常，我會使用window.onbeforeunload，但不適用于單頁應用程序。我發現在角度1中，您可以進入$locationChangeStart事件confirm為用戶拋出一個框，但是我沒有看到任何顯示如何使角度2正常工作的東西，或者該事件是否仍然存在。我也看到過為ag1提供功能的插件onbeforeunload，但同樣，我還沒有看到將其用于ag2的任何方式。我希望其他人找到了解決該問題的方法；兩種方法都可以很好地達到我的目的。
3 回答
料青山看我應如是
TA貢獻1772條經驗 獲得超8個贊
使用來自stewdebaker的@Hostlistener的示例確實運行良好，但是我對其進行了另一處更改，因為IE和Edge在MyComponent類上向最終用戶顯示了canDeactivate（）方法返回的“ false”。
零件：
import {ComponentCanDeactivate} from "./pending-changes.guard";
import { Observable } from 'rxjs'; // add this line
export class MyComponent implements ComponentCanDeactivate {
canDeactivate(): Observable<boolean> | boolean {
// insert logic to check if there are pending changes here;
// returning true will navigate without confirmation
// returning false will show a confirm alert before navigating away
}
// @HostListener allows us to also guard against browser refresh, close, etc.
@HostListener('window:beforeunload', ['$event'])
unloadNotification($event: any) {
if (!this.canDeactivate()) {
$event.returnValue = "This message is displayed to the user in IE and Edge when they navigate without using Angular routing (type another URL/close the browser/etc)";
}
}
}
- 3 回答
- 0 關注
- 885 瀏覽
添加回答
舉報
0/150
提交
取消