单击routerLink到子路径角度2后,视图不会更改

时间:2017-12-07 03:49:12

标签: javascript angular typescript

嘿,我有这个问题而且我似乎无法弄清楚出了什么问题,基本上我有routerLink进入子路线,网址会改变到我想要的路线但视图不会更新到链接到当前活动的子路由的组件

app.component.ts

<app-header></app-header>
<router-outlet></router-outlet>
<app-footer></app-footer>

HTML

<div class="wide component">
    <div class="page-wrap">
        <img class="logo" src="../../assets/img/our-work-component-logo.png"><br>
        <h2>Component Elite</h2>
        <h3>Web portal and promotions</h3>

        <p class="short-description">Lorem Ipsum</p>
        <a routerLink="component" class="button orange-button">View More</a>
    </div>
</div>

app.module.ts

import { OurWorkComponent } from './our-work/our-work.component';
import { ComponentComponent } from './our-work-content/component/component.component'

export const ROUTES: Routes = [
  { path: 'our-work', component: OurWorkComponent,
      children: [
         { path: 'component', component: ComponentComponent }
      ]
  }
];

@ngModule({
  declarations: [
     OurWorkComponent,
     ComponentComponent
  ],
  imports: [
     BrowserModule,
     RouterModule.forRoot(ROUTES)
  ],
  providers: [],
  bootstrap: [AppComponent]
})

1 个答案:

答案 0 :(得分:3)

由于children的{​​{1}}

而导致其未发生变化的原因
OurWorkComponent

这意味着children: [ { path: 'component', component: ComponentComponent } ] 中应该有<router-outlet>,但我无法看到它,只需在OurWorkComponent OurWorkComponent's中添加该内容即可

有关详细信息,请阅读:https://angular.io/guide/router#child-route-configuration

相关问题