Angular 基于外部数据的动态路由

我正在开发一个需要根据一些外部数据源配置路由的应用程序。应用程序的生命周期如下所示：

• ng2初始化与应用程序
• 应用程序包含页眉、路由器出口和页脚
• 默认路由配置为homeComponent
• homeComponent具有categoriesListComponent
• categoriesListComponent从categoriesService调用get方法
• categoriesService从api获取类别列表
• categoriesComponent呈现列表，并通过RouteConfiguration将每个类别的新路由注入应用程序

实际上还有另外一层RouteService的抽象层，但本例不需要它

这一部分是有效的，因为我们从主页开始，就进行了API调用，并为每个类别创建了

routerConfigs

。因此，当用户单击一个类别时，路由已经配置了正确的

类别组件

+

元数据

，并且它们显示了正确的信息

但是，如果直接访问特定的类别页面，ng2还没有该路由的

routerConfig

，因为API调用还没有返回任何内容，更不用说触发了。Ng2只呈现带有页眉、页脚和空路由器出口的基本应用程序

我能想到的唯一解决办法是相当“黑客”。在应用服务器上保留一个缓存的json文件，并将其加载到初始html中，然后将其注入ng2 bootstrap/init的服务中。通过这种方式，路由在ng2渲染页面之前配置

我在征求任何其他可能的建议，也许有人有更多的ng2经验，我可以插话。也许这已经解决了，我只是还没有完善我的谷歌fu

提前感谢。

在新路由器中（

=RC.3

）

resetConfig

可用于加载新路由

router.resetConfig([
{路径：'team/：id'，组件：TeamCmp，子项：[
{path:'simple'，组件：SimpleCmp}，
{path:'user/：name'，component:UserCmp}
] }
]);

您将有一个自定义的

routerLink

指令，或者只有一些链接或按钮，用于在单击加载新路由的位置时调用事件处理程序，然后调用

router.navigate（…）

，以导航到适当的路由

---

提供了一个RC.6Plunker

我不知道上面的评论之一是否是您想要的结果的解决方案，但我有一个新方法，可能对您和其他开发人员感兴趣

我创建了一个javascript文件，在其中添加我的路由

"use strict";
const home_component_1 = require("location javascript component file");
exports.DYNAMIC_ROUTES = [
    { path: '', component: your_component_name_component_1.YourComponentName },
]

然后在

app.routing.ts

（路由文件）中，必须向javascript文件添加import语句

// JAVASCRIPT IMPORT
import { DYNAMIC_ROUTES } from 'location javascript file';

const appRoutes: Routes = [
    { path: 'home', component: NormalLayoutComponent, children: DYNAMIC_ROUTES },
]

因此，通过使用此方法，您现在可以使用Typescript操作javascript文件以进行动态更改。您甚至可以通过php创建文件，然后将其保存在同一位置。注意，在我的例子中，您需要一个已经编译的组件，它为我处理一个组件中的所有路由

---

另外，如果您使用的编译器删除了您的javascript，请确保将其读取到构建文件夹或确保它与您的应用程序一起编译。

对不起，我没有注意到您的内容中有任何问题<代码>我正在询问其他可能的建议…好的，这太难读了，我只是快速扫描了一下，没有找到任何问号。路由器还不成熟，尽管他们刚刚提出了新的@angular/Router 3.0.0-alpha.3，目前正在为它编写文档。我认为路由应该绑定到组件。如果有一个组件根据某些API调用显示不同的内容，则将其设置为路由参数（

/category/：categoryName

）。您可以在上了解有关路由器的更多信息。组件仍然需要导入语句来导入组件顶部的所有路由。这实际上扼杀了动态路由的目的。e is

loadChildren

。我不知道它已经运行得有多好，resetConfig api提供了链接404@GünterZöchbauer这段代码应该放在哪里？我有类似的问题，但我需要调用注入服务来查找允许的路由。您可以将路由器注入该服务，然后您可以调用

resetConfig