Navigate to another page with a button in angular 2
You can use routerLink in the following manner,
<input type="button" value="Add Bulk Enquiry" [routerLink]="['../addBulkEnquiry']" class="btn">
or use <button [routerLink]="['./url']">
in your case, for more info you could read the entire stacktrace on github https://github.com/angular/angular/issues/9471
the other methods are also correct but they create a dependency on the component file.
Hope your concern is resolved.
Use it like this, should work:
<a routerLink="/Service/Sign_in"><button class="btn btn-success pull-right" > Add Customer</button></a>
You can also use router.navigateByUrl('..')
like this:
<button type="button" class="btn btn-primary-outline pull-right" (click)="btnClick();"><i class="fa fa-plus"></i> Add</button>
import { Router } from '@angular/router';
btnClick= function () {
this.router.navigateByUrl('/user');
};
Update 1
You have to inject Router
in the constructor like this:
constructor(private router: Router) { }
only then you are able to use this.router
. Remember also to import RouterModule
in your module.
Update 2
Now, After Angular v4 you can directly add routerLink
attribute on the button (As mentioned by @mark in comment section) like below (No "'/url?" since Angular 6, when a Route in RouterModule exists) -
<button [routerLink]="'url'"> Button Label</button>
<button type="button" class="btn btn-primary-outline pull-right" (click)="btnClick();"><i class="fa fa-plus"></i> Add</button>
import { Router } from '@angular/router';
btnClick= function () {
this.router.navigate(['/user']);
};