Menu
I need to show some content on certain page, in other pages it shouldn't be visible. How do I achieve it ? it doesn't work
*ngIf="[routerLink]="['/home']"
618
see how stupid that it looks in the addressbar. so if you try to use *ngIf to conditionally disable and enable router-outlet to overcome the problem it does not work. One router-outlet will get registered and no matter what you do, next router-outlet will not respond to the route changes.
Using Router linksAfter Angular v4 we can directly add a routerLink attribute on the anchor tag or button. Consider the following template, where routerLink attribute added to the anchor tag. The routerLink directive on the anchor tags give the router control over those elements.
RouterLinkActivelinkTracks whether the linked route of an element is currently active, and allows you to specify one or more CSS classes to add to the element when the linked route is active.
Routing in Angular allows the users to create a single-page application with multiple views and allows navigation between them. Users can switch between these views without losing the application state and properties. Approach: Create an Angular app that to be used.
You can inject Router from '@angular/router' and get the current route you're on.
For example:
// mycomponent.component.ts class MyComponent { constructor(public router: Router) { } } // mycomponent.component.html <div *ngIf="router.url === '/some/route'"> </div> I'm using the other approach.
template:
<div class="col-12 col-sm-12 col-md-12 col-lg-12"> <app-header></app-header> <app-banner *ngIf="isHomeRoute()"></app-banner> </div> .ts file:
import { Component, OnInit } from '@angular/core'; import { Router } from '@angular/router'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.less'] }) export class AppComponent implements OnInit { constructor(private router: Router) {} ngOnInit() {} isHomeRoute() { return this.router.url === '/'; } } If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
