角2路由器辅助路由不工作redirectTo
我最近启动了一个基于角2.0.0与角路由器(V3.0.0)的新项目。因此我有辅助路线的问题。角2路由器辅助路由不工作redirectTo
我想分开我的应用程序在不同的视图出现在每个国家像导航栏,主要内容,页脚等等。所以,当用户与网站互动只有页面的一部分需要改变( fe内容)发生变化,所有其他视图保持原样。 因此,我想用路由器在这次谈话中讨论的辅助功能:
设置我的文件内容如下:
app.html
<router-outlet name="navigation"></router-outlet>
<main>
<router-outlet></router-outlet>
</main>
<router-outlet name="footer"></router-outlet>
app.routes.ts
import {Routes} from '@angular/router';
export const rootRouterConfig: Routes = [
{path: '', redirectTo: 'start(navigation:/navigation)', pathMatch: 'full'}
];
个
start.routes.ts
import {Routes} from '@angular/router';
import {StartContentComponent} from './startContent/startContent.component';
import {StartNavigationComponent} from "./startNavigation/startNavigation.component";
export const startRouterConfig: Routes = [
{path: 'start', component: StartContentComponent},
{path: 'navigation', component: StartNavigationComponent, outlet: 'navigation'}
];
现在的问题是:如果我手动输入
http://localhost:3000/#/start(navigation:/navigation)
到浏览器两个组件都正确显示的URL。但在app.routes.ts重定向不能正常工作和访问http://localhost:3000/#/当我得到以下错误:
Uncaught (in promise): Error: Cannot match any routes: ''
官方角2个文档说一无所知辅助路由,但只有这将在未来进行讨论。除此之外,我还发现了其他一些博客帖子,但没有一篇讨论与重定向结合的辅助路线。
有谁知道我的问题是什么或有类似的问题?
是否有另一种方法来构建我的页面来实现我想要的?
我是否应该切换到Ui路由器?
我有同样的问题,并且Binary先生的解决方案似乎是在正确的轨道上,但this site的'无组件路线'部分让我到那里。
我的解决办法:
export const RedirectionIncludingAuxRoutes: RouterConfig = [
{
path: 'redirect-me',
redirectTo: 'redirected-with-aux'
},
{
path: 'redirected-with-aux',
children: [
{
path: '',
component: PrimaryComponent
},
{
path: '',
component: SecondaryComponent,
outlet: 'auxiliary'
}
]
}
]
非常感谢!对不起,我的答案需要这么长时间,现在工作正常! –
当你有更多零件更换时,这是推荐的方法。
反正尝试改变
redirectTo: 'start(navigation:/navigation)'
to
redirectTo: 'start/(navigation:navigation)'
而且
{path: 'start', component: StartContentComponent},
{path: 'navigation', component: StartNavigationComponent, outlet: 'navigation'}
to
{path: 'start', component: StartContentComponent,
children: [
{path: 'navigation', component: StartNavigationComponent, outlet: 'navigation'}
]},
另外我想这篇文章推荐给路由器:
http://blog.angular-university.io/angular2-router/
我按照你的设想改变了它,但并没有改变错误。它仍然没有工作:/ 谢谢,但我已经完成了这篇文章。如前所述,新路由器的资源并不多。 –
对不起,建议的解决方案似乎不起作用。如果我打开页面,我会收到错误信息:“错误:无法匹配任何路由:'' –
你几乎没有。只有一步之遥。您需要连线rootRouterConfig通过以下方式
import {Routes , RouterModule } from '@angular/router';
@NgModule({
imports: [RouterModule.forRoot(rootRouterConfig)],
exports: [RouterModule],
})
OR
import {ModuleWithProviders } from '@angular/core';
import {Routes , RouterModule } from '@angular/router';
export const routing: ModuleWithProviders =RouterModule.forRoot(rootRouterConfig);
让我知道哪一个对你的作品之一。
能否请您发表您的工作代码?谢谢 ! – Stanislasdrg