如何在 Angular 2 中实现路线导航期间的加载屏幕？

在 Angular 2 中导航路线时显示加载屏幕

在 Angular 2 中，在路线转换期间显示加载屏幕对于提供用户反馈和增强应用程序的感知性能非常有用。这可以通过利用 Angular Router 提供的导航事件来实现。

提供的解决方案涉及订阅这些事件并进行适当的 UI 更改。但是，重要的是要考虑其他事件（例如 NavigationCancel 和 NavigationError），以便在转换失败时停止微调器。下面是 Angular 2 的 TypeScript 组件系统中的实现：

对于相应的视图，添加 spinner 元素并使用 *ngIf 指令有条件地显示它：

用于性能优化，考虑利用 Angular NgZone 和 Renderer 来切换微调器元素的可见性，从而绕过更改检测：

在相应的视图中，使用对元素的直接引用：

以上是如何在 Angular 2 中实现路线导航期间的加载屏幕？的详细内容。更多信息请关注PHP中文网其他相关文章！