javascript - 使用 Angular 5 将警报或通知转移到下一条路线

Question

我正在使用 Angular 5 构建 CRUD(创建、读取、更新、删除)表单，并希望导航到显示所有已添加元素(包括新元素)概述的路线。

this.myElement.create({
    //... Do some API magic
}).subscribe(() =>
    this.router.navigate(['/overview']);
);

更新数据库后，用户将通过router.navigate到达概览。无论更改是否成功，都应该显示一条消息(警报、通知、 toast 或其他内容)。

可能的方法:

1. 我是否必须实现自己的服务来传输这样的信息？
2. Angular 中有内置解决方案吗？
3. 我应该使用事件处理程序或观察者服务器之类的东西来监视任何 CRUD 方法吗？

Answer 1

您需要小心实现此警报的位置。如果它是一项服务，您可能会这样做

.subscribe(() =>
    this.toast.show('Task is finished');
    this.router.navigate(['/overview']);
);

由于您要切换路线，toast组件必须位于 <router> 的父模板中或向上。

如果服务是针对 body 设计的标签，例如使用position: fixed 。那么无论如何你都是安全的。

如果您担心的话，我认为整个页面不会刷新。

只是回答你的问题

• 我是否必须实现自己的服务来传输这样的信息？是的，不一定是你，而是某人。

• Angular 中有内置解决方案吗？ 也许，因为您可以将定位到屏幕的元素作为简单的警报。 Angular 没有为此任务执行任何特定操作。

• 我应该使用事件处理程序或观察服务器之类的东西来监视任何 CRUD 方法吗？ 不需要，您希望先完成此警报，然后再转到其他警报。但是，如果您希望其他人知道已触发警报，那么是的，您希望该服务发布可观察的内容。