Attempting to hide a component based on matching routes, it is currently working with one route but not with multiple routes.
import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-root',
template: `
<app-header *ngIf="!_router.url.includes('account', 'admin', 'app')"></app-header>
<router-outlet></router-outlet>
<app-footer *ngIf="!_router.url.includes('app', 'account', 'admin')"></app-footer>
`
})
export class RootComponent {
router: string;
constructor(
public _router: Router
) {
this.router = _router.url;
}
}
The current implementation does not work for multiple words in the includes() function. Is there an alternative method to achieve this?
edit
I have attempted the following...
import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-root',
template: `
<app-header *ngIf="!hasMatches('app', 'account', 'admin')"></app-header>
<router-outlet></router-outlet>
<app-footer *ngIf="!hasMatches('account', 'admin', 'app')"></app-footer>
`
})
export class RootComponent {
router: string;
constructor(
public _router: Router
) {
this.hasMatches();
this.router = _router.url;
}
private hasMatches(...values: string[]): boolean {
let matchFound = false;
for (let i = 0; i < values.length; i++) {
if (this.router.indexOf(values[i]) > -1) {
matchFound = true;
break;
}
}
return matchFound;
}
}
Thank you!