Вам необходимо настроить маршрут вашего приложения, лично я делаю это в app.module.ts, но вы можете сделать это в другом файле и затем импортировать его в ваш app.module.ts
import ...
import { RouterModule, Routes } from '@angular/router';
import { ContactComponent } from 'path of component';
const appRoutes: Routes = [
{path: 'contact', component: contactComponent}
]
@NgModule({
declarations: [
...,
ContactComponent
],
imports: [
BrowserModule,
RouterModule.forRoot(appRoutes)
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Тогда в вашей навигационной панели <li><a routerLink="contact"><strong>Contact</strong></a></li>
Будьте осторожны, чтобы использовать <router-outlet></router-outlet>
вместо <app-yourAppName></app-yourAppName>
для вызова вашего основного компонента в app.component.html
, с выходом маршрутизатора Angular будет вызывать нужный компонент, нажав на ссылку маршрутизатора.