Smart Navigation Service

The Smart Navigation Service provides an easy way to navigate through your app regardless of whether a MDI interface is used or not. It automatically handles NG Router navigation and/or Smart MDI Component opening/closing of tabs as needed.

 

Navigating to a form

import { SmartNavigationService } from '@consultingwerk/smartcomponents-core';
 
constructor(private navigationService: SmartNavigationService) { }
 
navigateToCustomerMaintenance() {
	this.navigationService.navigate('/customer')
			.then(() => { //success })
			.catch(() => { //failure });
}

 

Navigating to a form that takes parameters

import { SmartNavigationService } from '@consultingwerk/smartcomponents-core';

constructor(private navigationService: SmartNavigationService) { }
 
navigateToCustomerOrders(custNum: number) {
	this.navigationService.navigate('/customer/:CustNum/orders', { paramMap: { CustNum: custNum } })
			.then(() => { //success })
			.catch(() => { //failure });
}

Note

When calling .navigate, the Smart Navigation Service will perform navigation according to the Smart Configuration that was provided. If mdiInterface is set to true, then the Smart MDI Component will display the desired form inside a tab. If the tab is already opened, the Smart MDI component will switch to that rather than opening a new tab. Similarly, if mdiInterface is set to false, the desired form will be loaded in the NG router outlet named "view".

 

Subscribing to navigation events

import { SmartNavigationService, SmartNavigationEvent } from '@consultingwerk/smartcomponents-core';

constructor(private navigationService: SmartNavigationService) { }
 
ngOnInit() {
	this.navigationService.navigationStart.subscribe((ev: SmartNavigationEvent) => {
			console.log(`navigation to form ${ev.formName} just started`);
	});
	this.navigationService.navigationEnd.subscribe((ev: SmartNavigationEvent) => {
			console.log(`navigation to form ${ev.formName} was successful.
	});
}