angular-routerLink 的问题

Problems with angular-routerLink

我有两个关于 routerLink 的问题。第一个问题是 routerLink 无法点击。我的意思是字面意思。这是我的代码:

<div class="collapse navbar-collapse" style="margin-left: 50%">
          <ul class="navbar-nav ml-auto">
            <li class="nav-item">
              <a class="nav-link" href="/login">Log in</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" routerLink="/register">Register</a>
            </li>
          </ul>
</div>

当我使用 href 时,一切正常。我在 app.module.ts

中导入了 Routes 和 RouterModule
import { RouterModule, Routes } from '@angular/router';

然后我创建了路径:

const appRoutes: Routes = [
  {path:'',component:HomeComponent},
  {path:'login',component:LoginComponent},
  {path:'register',component:RegisterComponent}
]

并导入它们:

imports: [
    BrowserModule,
    RouterModule.forRoot(appRoutes)
  ],

我也在app组件中使用了router-outlet:

<router-outlet></router-outlet>>

我可以通过 URL 或 href 导航,一切正常,但 routerLink 无法点击。当我将光标放在它上面时,光标图标会发生变化,就像在写文字一样。

我的第二个问题是 routerLink 属性 绑定。它给了我一个错误。代码:

<li class="nav-item">
    <a class="nav-link" [routerLink]="['/register']">Register</a>
</li>

错误:

 Can't bind to 'routerLink' since it isn't a known property of 'a'.

31               <a class="nav-link" [routerLink]="['/register']">Register</a>

有什么想法吗?

将所有声明检查到 app.module.ts 文件中。 在这里您可以找到针对您的问题的 routerLink 指令用法的工作示例:

https://stackblitz.com/edit/angular-ivy-tb2ssl?file=src/app/app.component.html