Angular 2/4：路由无法正常工作

Question

我的路由

   RouterModule.forRoot([
            { path: 'login', component: LoginComponent },
            { path: 'home', component: HomeComponent },
        ])

在应用程序组件中，我有这个.router.navigate（[＆＃39; home＆＃39;]）; 这并没有导航我到家庭组件。

当我转到登录页面时，我的左侧导航也会显示。

我的app.component.ts

<div class='container-fluid'>
    <div class='row'>

        <div class='col-sm-3'>
            <nav-menu></nav-menu>
        </div>

        <div class='col-sm-9 body-content'>
            <router-outlet>
                <input style="float:right" placeholder="Search" autofocus>
            </router-outlet>
        </div>

    </div>
</div>

Answer 1

这个错误就是这个错误。

之前你有许多其他模块加载，因此一个人已经定义了一个空路径，因此路由器不会将你的路由放到你的模块中。 （模块导入的顺序事项）。 如果你懒得加载这个模块，检查其他延迟加载模块的顺序，然后检查你将RoutingModule放入模块的顺序（这里的顺序很重要）。 Angular官方doc建议将此作为第一个，呈现匹配url的第一个路径。

Answer 2

试试这个：

创建名为app.routing.ts的新文件

import { LoginComponent } form ...
import { HomeComponent } from ..

export const routing = RouterModule.forRoot([
    { path: 'login', component: LoginComponent },
    { path: 'home', component: HomeComponent }   
]);

//And Finaly in app.module.ts
//include the constant like this
import { routing } from './app.routing';

.....

@NgModule({
   imports: [routing]
});