以 HTML 文件问题中的路由为条件

Question

我找到了这个用于检测当前路线的代码，但它似乎在 Angular 7.

中不起作用

代码如下：

app.component.ts

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

...

constructor(private router: Routes) {}

app.component.html

<div *ngIf="router.url === '/someroute'">We are in someroute</div>

如何检查 NG 7 组件的 .html 中的路由？

Answer 1

你必须注入 Router 而不是 Routes

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

...

constructor(public router: Router) {}

并像

一样使用它

<div *ngIf="router.url === '/someroute'">We are in someroute</div>

Answer 2

如果你想在模板中使用它，你必须将它定义为public而不是private并且使用ActivatedRoute而不是Routes

所以：

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

...

constructor(public router: ActivatedRoute) {}

Answer 3

Url 在 Routes 上不可用，您必须使用 Router

下面是例子，

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

constructor(private router: Router) {}

并在 HTML、

<div *ngIf="router.url === '/someroute'">We are in someroute</div>

Answer 4

router 必须是 Router 类型而不是 Routes 并且为了在视图模板中使用它应该是 public.

    import {  Router } from '@angular/router';
     .
     .
     .
     constructor(public router: Router) { }

Conditional on route in HTML file issue