角度7:误解了路由器链接的导入方式

时间:2018-11-07 21:00:49

标签: angular angular7

我是Angular的新手,并且正在学习https://www.youtube.com/watch?time_continue=1223&v=5wtnKulcquA教程。

我知道我要在爬网之前运行,但是我似乎无法弄清楚routerLink导入的工作方式。根据ng服务测试,我的导入声明是正确的,我认为问题是我缺少有关路由路径或实际路由链接的知识。我试图操纵路径,但没有任何效果。

有人可以向我解释我在想什么吗?

我的目录结构是:

app
    launcher
        header
        content (where routerOutlet is located)
            welcome
            about
            projects
            client
            contact
        footer
    portal
       ...

My navigation links in the header folder:
<header>
  <div class="container">
    <a routerLink="/" class="logo">{{pageTitle}}</a>
    <nav>
      <ul>
        <li><a routerLink="/">Home</a></li>
        <li><a routerLink="/about">About</a></li>
        <li><a routerLink="/projects">Projects</a></li>
        <li><a routerLink="/client">Client</a></li>
        <li><a routerLink="/contact">Contact</a></li>
      </ul>
    </nav>
  </div>

在我的app-routing.module.ts中:

    import { NgModule } from '@angular/core';
    import { Routes, RouterModule } from '@angular/router';
    import { WelcomeComponent } from './launcher/content/welcome/welcome.component';
    import { AboutComponent } from './launcher/content/about/about.component';
    import { ProjectsComponent } from './launcher/content/projects/projects.component';
    import { ClientComponent } from './launcher/content/client/client.component';
    import { ContactComponent } from './launcher/content/contact/contact.component';

const routes: Routes = [
  { path:'', component: WelcomeComponent },
  { path:'', component: AboutComponent },
  { path:'', component: ProjectsComponent },
  { path:'', component: ClientComponent },
  { path:'', component: ContactComponent },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

1 个答案:

答案 0 :(得分:0)

已解决。我试图跟随视频,但是错过了指导员输入路径说明的时间。填充并固定。谢谢。