Angular 5 路由器不工作

Question

我正在尝试在图标上实现 link。我在 content-toolbar.component.html:

上有这篇文章

    <span>
      <a routerLink="/main" routerLinkActive="active" ng-reflect-router-link="/main">
        <img src="/assets/icons/logo_white.svg" class="logo">
      </a>
    </span>
    <router-outlet></router-outlet>

我正在导入

import { RouterModule } from '@angular/router';

at content-toolbar.module.ts 并在 imports 数组上声明它。在 content-toolbar.component.ts 我正在导入这个：

import { Router } from '@angular/router';

我做错了什么？

编辑虽然检查我得到的元素

<span>
  <a routerlink="/main" routerlinkactive="active">
    <img class="logo" src="/assets/icons/logo_white.svg">
  </a>
</span>

原来这张图片还不能点击。

这是我的 main.routing.ts:

    import { NgModule } from '@angular/core';
    import { RouterModule } from '@angular/router';

    import { MainComponent } from './main.component';
    import { AccountMainComponent } from '../account-main/account-main.component';
    import { AuthGuard } from '../common/_guards/auth.guard';
    import { FinancialAccountsComponent } from '../financial-accounts/financial-accounts.component';
    import { ConfigSysComponent } from '../config-sys/config-sys.component';
    import { ConciliacaoContabilComponent } from '../conciliacao-contabil/conciliacao-contabil.component';
    import { ReportComponent } from '../report/report.component';


    @NgModule({
      imports: [
        RouterModule.forChild([
          { path: 'main',
            component: MainComponent,
            canActivate: [AuthGuard],
            children: [{ path: '', component: AccountMainComponent },
            { path: 'financial-accounts', component: FinancialAccountsComponent },
            { path: 'system-config', component: ConfigSysComponent },
            { path: 'conciliacao', component: ConciliacaoContabilComponent },
            { path: 'report', component: ReportComponent },
          ]}
        ])
      ]
    })
    export class MainRouting { }

Answer 1

你试过了吗：

<span>
      <a [routerLink]="['/main']">
        <img src="/assets/icons/logo_white.svg" class="logo">
      </a>
    </span>

Answer 2

我发现 TS 文件声明我的 content-toolbar 没有导入数组 RouterModule（angular 模块）和 MainRouting（自定义模块导致 '/主要的'）。解决后，它像上面所说的那样工作

Angular 5 路由器不工作

Angular 5 Router not working

angular-routing

angular

angular5