Asp.net 核心角度模板路由器插座未正确清除

Question

我从 asp.net core 2版本中的角度spa模板开始。 我首先注意到在VS中进行更改并保存后，浏览器会刷新，但内容是重复的，一式三份。等。

我现在正在用一个路由器插座区域进行一些基本的组件路由。 我尝试在 html 中使用 routerlink，并在代码中使用路由器导航和导航，结果相同。 在第一次导航时，将加载新内容，但不会清除原始内容。 如果我再次点击导航按钮，它会正确重新加载。 我还通过直接进入浏览器来测试路径，一切正常。 由于我在开发模式下运行，不知道它是否与实时刷新有关，或者它是否具有 .net 模板已实现角度 spa。

一点也不花哨，没有路线警卫或其他任何东西

喜欢在与 angular 相同的项目中拥有 mvc webapi 控制器的能力，但到目前为止确实是一个痛苦。

*****************
Routing Module
@NgModule({
imports: [
RouterModule.forRoot([
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'home', component: HomeComponent },
{ path: 'maint/uom/:id', component: UomDetailComponent },
{ path: 'maint/uom', component: UomMaintenanceComponent },
{ path: 'httptest', component: HttpTestComponent},
{ path: '**', redirectTo: 'home' }
]),
],
exports: [RouterModule]
})
export class AppRoutingModule { }
*******************************************
//navigate in ts file
showUomDetail(uom: IUom) {
console.log(uom);
this._router.navigate(['/maint/uom', uom.id]);
// this._router.navigateByUrl('/maint/uom/5');
//route to detail page
}

*****
HTML snippet
<a class="btn btn-primary" [routerLink]="['/httptest']">View</a>
*****
app.component.html
<div class='container-fluid'>
<div class="row">
<nav-menu></nav-menu>
</div>
<div class='row'>
<div class='col-sm-9 body-content'>
<router-outlet></router-outlet>
</div>
</div>
</div>

Answer 1

我终于开始从应用程序中提取组件，直到找到它。 它是BrowserAnimationModule。 一旦我把它，一切都按预期工作。