应用程序中所有可用路由的 Angular 2/4 预加载器

Question

我为 Angular 应用程序创建了一个预加载器服务，它在顶部导航下方显示预加载器。在从一条路线导航到另一条路线以及应用程序中可用的所有路线时，我需要显示预加载器。到目前为止，我已经在我的应用程序的所有路由中实现了预加载器服务。但是使用这种方法，我将不得不为所有路线重复编写相同的代码。我觉得必须有办法避免这种情况，但我无法找到确切的解决方案。

Answer 1

在引导的 Angular 模块上提供服务，以便该服务可全局访问（依赖注入将在每个组件上提供相同的实例）并且将存在于应用程序的整个生命周期（Singelton），然后订阅 ' route.events'（是一个 Observable）在路线改变时通过不同的事件（NavigationStart、NavigationEnd 等）获得通知。

当您需要读取路由器配置时，请使用“router.config”（是一个数组）。

在组件构造函数中添加服务作为参数并获取您需要显示的内容。