Маршрутизация Angular 6 со звездочкой
На данный момент у меня есть простой проект angular 6. В модуле маршрутизации приложений я только что настроил маршруты как звездочки, чтобы указывать на мой собственный CmsComponent.
app.routing.module.ts:
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule, Routes } from '@angular/router';
import { CmsComponent } from './cms/cms.component';
import { HttpClientModule } from '@angular/common/http';
const routes: Routes = [
{path: '**', component: CmsComponent}
];
@NgModule({
imports: [
RouterModule.forRoot(routes),
HttpClientModule
],
exports: [ RouterModule ]
})
export class AppRoutingModule {
}
В разделе html это в основном то, что у меня есть:
<div class = "banner">
<nav>
<ul>
<li *ngFor = "let nav of navItems"><a routerLink = "{{nav.url}}">{{nav.title}}</a></li>
</ul>
</nav>
</div><!-- banner -->
Но когда я нажимаю на ссылку, содержимое не обновляется плавно, только при жестком обновлении. Я предполагаю, что это как-то связано со звездочками в путях маршрута?
Потому что, когда я меняю пути с ** на статические заголовки / URL-адреса, все работает нормально.
Я пробовал использовать URL-адреса для маршрутов, но я бы предпочел поискать что-нибудь, с чем можно работать **. Какой будет лучший подход?
path: '**' используется, когда приложение имеет код ошибки 404.
Ответы 1
Вам необходимо определить в вашей переменной маршрутов все значения nav.url. Что-то вроде этого.
const routes: Routes = [
{path: 'home', component: HomeComponent},
{path: 'login', component: LoginComponent},
{path: 'register', component: RegisterComponent},
{ path: '**', redirectTo: 'home', pathMatch:'full' }
];
вам нужно сделать другой маршрутизатор в соответствии с вашей ссылкой на маршрутизатор в вашем файле маршрута.