angular - 当我单击锚按钮时，当 routerLink 不起作用时，我正在使用 Angular 7 它不起作用

Question

在 Angular 7 中，我已经定义了不同的组件应用程序文件夹并在路由中定义组件很好，当我在 url 中定义路由器名称时，工作正常向我显示附加到该 url 的组件但是当我在锚标记中定义该路由名称时单击锚定它，在这里不起作用的是我的 html 代码

<li class="nav-item">
  <a class="nav-link" routerLink="/home">Home</a>
</li>
<li class="nav-item @@about">
  <a class="nav-link" routerLink="/about">About</a>
</li>
<li class="nav-item @@blog">
  <a class="nav-link" routerLink="/blog">BLOG</a>
</li>

这是我的路由器

const routes: Routes = [{
    path: '',
    redirectTo: 'home',
    pathMatch: 'full'
  },
  {
    path: 'home',
    component: HomeComponent
  },
  {
    path: 'about',
    component: AboutComponent
  },
  {
    path: 'blog',
    component: BlogComponent
  },
];

标签： angularangular7angular7-router

Answer 1

如果您的锚标记未变为蓝色，则表示 routerLink 未与锚标记绑定。那是因为你还没有导入RouterModule.

RouterModule注意：您必须在声明此组件的模块中导入，routerLink而不是在app.module.ts. 例如：如果你有home.component.tsinhome.module.ts并且你想使用in<a [routerLink]="[/student]"></a>然后home.component.html添加RouterModulehome.module.ts

import {RouterModule} from '@angular/router';
@NgModule(
{ 
  ...
   import:[
     ...
       RouterModule
     ...
   ]
  ...
}
)