Question

我试图在图标上实现链接。我在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';

在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（角度模块）和MainRouting（自定义模块导致＆＃39; / main＆＃39）。在这个问题解决之后，它就像上面提到的评论一样工作

Angular 5路由器无法正常工作

2 个答案: