Question

我的路线设置如下：

const routes: Routes = [
...CoreRoutes,
{ path: 'error', component: ErrorPage},
{ path: 'login', component: LoginPage},
{ path: '', redirectTo: 'app/dashboard', pathMatch: 'full'},
{ path: '**', redirectTo: 'app/dashboard'},
];

将子路线（CoreRoutes）作为：

export const CoreRoutes: Routes = [{
path: 'app',
component: Core,
children: [
  { path: 'dashboard', component: Dashboard},
  { path: 'another-page', component: AnotherPage},
  { path: 'maps-vector', component: MapsVector},
  { path: 'discuss1', component: Discuss1},
  { path: 'profile', component: Profile},
  { path: 'discuss2', component: Discuss2},
  { path: 'grid', component: Grid},
  { path: 'service/:service', component: DynamoComponent},
  { path: 'dynamo', component: DynamoComponent},
  { path: 'tables/dynamic', component: TablesDynamic}
]

}];

当我启动应用程序时，它会正确地重定向到“app / dashboard”，但是当我使用我的发电机视图中的代码进行导航时

this.router.navigate(['app/service/', encodedParams]);

到app / service：service我可以看到它进入正确的路径（并实例化组件，但在其NavigationEnd之后它然后重定向到默认的'app / dashboard'。我只能假设它回到了默认路线，但无法弄清楚它为什么这样做。

如果我在重定向后第二次尝试访问app / service：service，则可以正常工作。

如果我从应用程序路由中删除默认路由，那么它可以正常工作但我没有获得默认路由的好处。

我知道这可能很简单，因为我最近才开始使用角度2，但是我已经在这个问题上打了很长时间而且我不知道为什么这条路线表现不佳并且选择了默认路线当它成功加载子路径时。

其他所有路由都没有此问题，尽管这一条路由是我使用代码导航的路由，其他路由在其网页上使用路由器链接

这是我从导航事件中记录到控制台的信息，显示在成功找到正确的路由应用/服务后重定向到'/'

Angular 2 is running in the development mode. Call enableProdMode() to enable the production mode.
core.ts:246navigation end id: 1 url: /
core.ts:243 navigation start id: 2 url: /app/dynamo
core.ts:240 navigation routerecognized id: 2 url: /app/dynamo
core.ts:246 navigation end id: 2 url: /app/dynamo
core.ts:243 navigation start id: 3 url: /app/service/%257B...
core.ts:240 navigation routerecognized id: 3 url: /app/service/%257B...
core.ts:246 navigation end id: 3 url: /app/service/%257B.
core.ts:243 navigation start id: 4 url: /
core.ts:240 navigation routerecognized id: 4 url: /
core.ts:246 navigation end id: 4 url: /

Answer 1

你缺少导航中的正斜杠。

  this.router.navigate(['/app/service/', encodedParams]);

请注意在/

之前转发斜杠app/service/ -> /app/service/

希望这会有所帮助!!

Answer 2

我不确定我是否已找出根本问题，但我找到了一种方法来解决它，但却没有真正理解它的工作原理。

在DynamoComponent中，它调用数据服务，缓存这些结果，为该数据生成模板，然后使用模板生成组件并传入请求的数据。我想在原始组件和子组件之间的数据填充缓存对象上可能存在某种类型的数据同步问题？

我在app中使用缓存服务（在父对象上使用以确保全局访问），我所描述的异常就是当我使用我编写的MemoryStorage类（与SessionStorage，LocalStorage和NoStorage类并行）时缓存远程数据的结果，第一次通过它应该从服务中获取数据，随后它应该从内存缓存中获取数据。尽管使用默认值初始进入页面'/ service'并且没有参数可用，但是下一个带参数的后续调用没有，尽管所有这些调用都在第一个之后工作。

public static double pay (double salary, int hours) {

    double pay = 0;

    for (int i = 0; i < hours && i < 8; i++) {
        pay += salary;
    }
    for (int i = 8; i < hours; i++) {
        pay += (salary * 1.5);
    }

    return pay;
}

我找到的解决方法是使用会话或本地存储，虽然我的MemoryStore可能有同步问题的任何指针都会受到赞赏，因为我不能总是依赖会话或本地存储。

此外，我真的不确定为什么这会导致路由转到根路由而不会产生任何错误。没有任何意义，但我已经确认它在使用LocalStorage或SessionStorage时没有这样做，尽管在每次需要数据时进行服务调用时仍然会使用NoCache同步问题。

Angular 2 RC5路由设置，从代码

2 个答案: