Question

我正在使用Angular 6实现系统，路由时遇到麻烦。我做了整个“管理员”部分，这是结构：

<div class="wrapper">
    <div class="sidebar" data-background-color="white" data-active-color="danger">
        <app-sidebar></app-sidebar>
    </div>
    <div class="main-panel">
        <app-navbar></app-navbar>
        <div class="content">

            <router-outlet></router-outlet>

        </div>
        <app-footer></app-footer>
    </div>
</div>
<app-fixedplugin></app-fixedplugin>

我的问题是，如何实现LoginComponent。我是否需要将LoginComponent包含在路由器出口中？

Answer 1

创建单独的登录组件

ng g component login

这将创建LoginCompoent

此后，您需要在app.module.ts

中添加LoginCompoent的路由路径

import { RouterModule, Routes } from '@angular/router';
import { LoginComponent } from './home/login.component';

@ngModule({
  imports: [
            BrowserModule, 
            RouterModule.forRoot([
              {path: 'login', component: LoginComponent},
              { enableTracing: true } // <-- debugging purposes only
           ])
          ]
})

然后重新启动ng服务器。

现在，您可以通过路径localhost:4200/login或localhost:4200/#/login来使用LoginComponent

如何使用Angular 6实现LoginComponent？

1 个答案: