使用路径的旧和新组件数据都以角度4显示在屏幕上

Question

我有3个组件：

（1）guessComponent（2）signupComponent（3）mainComponent

我在 app.component.html 文件中编写了guessComponent的选择器。

 <a  routerLink="/signup" class="active">Sign up</a>

我使用route在屏幕上显示其他组件数据，但是当我点击任何锚点时， guessComponent 和 signupComponent 数据显示 < / p>

我希望当我点击注册时，只会显示其数据。

我的 app.module.ts 路由配置是：

  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule.forRoot([
      {
        path: 'signup',
        component: SignupComponent
      },
      {
        path: 'main',
        component: MainComponent
      }
    ])
  ]

Answer 1

the < RooterOutlet > div Allows Angular to know where the views to the roads will be placed. Angular works in SPA (Single Page App) mode. So you need to have an Entry component (main.component) with Only RooterOutlet div. At each call the view will be loaded here.

In your example you added RooterOutlet at the end of a page. So when you call your view, angular loads the page here.