Angular 2 - Navegación

En Angular 2, también es posible realizar una navegación manual. Los siguientes son los pasos.

Step 1 - Agregue el siguiente código al archivo Inventory.component.ts.

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

@Component ({  
   selector: 'my-app',  
   template: 'Inventory 
   <a class = "button" (click) = "onBack()">Back to Products</a>' 
})  

export class AppInventory {  
   constructor(private _router: Router){} 

   onBack(): void { 
      this._router.navigate(['/Product']); 
   } 
}

Los siguientes puntos deben tenerse en cuenta sobre el programa anterior:

Declare una etiqueta html que tenga una función onBack etiquetada en el evento de clic. Por lo tanto, cuando un usuario hace clic en esto, se lo dirigirá de nuevo a la página Productos.
En la función onBack, use el router.navigate para navegar a la página requerida.

Step 2- Ahora, guarde todo el código y ejecute la aplicación usando npm. Vaya al navegador, verá el siguiente resultado.