I'm currently facing an issue with navigation in Angular 6.
In Ionic, we can navigate to a different page by using navCtrl.push('ExamplePage')
;
However, in Angular 6, I am having trouble navigating through a button click like this:
app.component.html
<button (click)='goToExamplePage()'>ExamplePage</button>
<router-outlet></router-outlet>
app.component.ts
import {Router} from '@angular/router';
constructor(private router: Router)
goToExamplePage(){
this.router.navigate(['/example'])
}
app.module.ts
import { RouterModule, Routes } from '@angular/router';
const appRoutes: Routes = [
{path: '', component: AppComponent},
{ path: 'example', component: ExampleComponent }
];
@NgModule({
declarations: [
AppComponent,
ExampleComponent
],
imports: [
RouterModule.forRoot(
appRoutes,
{ enableTracing: true } // <-- debugging purposes only
)
...
],
bootstrap: [AppComponent],
exports: [
RouterModule
]
})
Unfortunately, the navigation functionality is not working as expected. Any assistance would be greatly appreciated.