Navigating Programmatically in Anuglar 4

On click button change navigation in angular 4.

–HTML File

<button class="btn btn-primary" (click)="onLoadServers()">Load Servers</button>

–TS File

import { Component, OnInit } from '@angular/core';
import { Router } from "@angular/router";

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {

  constructor(private router: Router) { }

  ngOnInit() {
  }

  onLoadServers(){
    // complex calculation
    this.router.navigate(['servers']);
  }
}

Leave a Reply

Your email address will not be published. Required fields are marked *