RouterLink在IE和Firefox中不起作用（路由不跳转）的问题

问题描述

假设路由已配置好，但运行如下代码后，点击 Admin 按钮却没有跳转至 admin 界面。（clrDropdownItem为按钮样式）

main.component.html

<button type="button" clrDropdownItem >
	<a routerLink="/admin"> Admin </a>
</button>
复制代码

解决方法

方法一

将 clrDropdownItem 样式放在<a>标签，不使用<button>标签

<a clrDropdownItem routerLink="/admin"> Admin </a>
复制代码

咦，样式不生效怎么办？看方法二吧。

方法二

使用<button>标签和Router.navigate方法

main.component.html

<button type="button" clrDropdownItem (click)="gotoAdmin()">
    Admin
</button>
复制代码

main.component.ts

import { Router } from '@angular/router';
...
export class MainComponent  {
    constructor(
        private router: Router
    ) {}
    
    gotoAdmin() {
        this.router.navigate(['/admin']);
    }
}

复制代码

参考链接

Angular5在IE和Firefox中没有使用Routerlink和按钮的响应

Angular官方文档：路由与导航

转载于:https://juejin.im/post/5c79f32d51882540766b64b4