为什么路由不适用于Angular 4?

时间:2018-03-23 17:40:30

标签: angular

我有这段代码:

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { AuthRegComponent } from './Components/Auth_Reg/Auth_Reg.component';

import { FirstSetupComponent } from './Components/First_Setup/First_Setup.component';

const appRoutes: Routes = [
  { path: 'setup', component: FirstSetupComponent },
  {
    path: '',
    redirectTo: 'home',
    pathMatch: 'full'
  },
  {
    path: 'home',
    component: AuthRegComponent
  },
];

@NgModule({
  imports: [
    RouterModule.forRoot(appRoutes, { enableTracing: true })
  ],
  exports: [
    RouterModule
  ],
  providers: [

  ]
})
export class AppRoutingModule { }

路径“”主页 wor。如果我尝试/设置,我会看到AuthReg组件。但是应该显示FirstSetupComponent组件。如果FirstSetupComponent组件的编号被替换。我仍然会再次看到AuthRegComponent

我的app.module代码:

import { HttpClientModule } from '@angular/common/http';
import { HttpModule } from '@angular/http';
import { RouterModule, Routes } from '@angular/router';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';

import { AuthRegComponent } from './Components/Auth_Reg/Auth_Reg.component';

import { FirstSetupComponent } from './Components/First_Setup/First_Setup.component';
import { TestService } from './Services/service.test'; 

@NgModule({
  declarations: [
    AuthRegComponent,
    FirstSetupComponent,
  ],
  imports: [
    BrowserModule, HttpClientModule, HttpModule, AppRoutingModule
  ],
  providers: [
    TestService],
  bootstrap: [AuthRegComponent]
})
export class AppModule { }

1 个答案:

答案 0 :(得分:0)

您可以查看以下内容

  1. 如果您已将路由器插座放在正确的位置,例如app.component.html
  2. 您应尝试访问以下路线

    <a [routerLink]="['/user/dummy']">
       link to user component
    </a>
    
  3. 如果您已完成上述2,请正确检查控制台