我的网址在角度4中没有正确重定向

Question

我是新手，我只是使用命令添加新组件。组件已成功创建。

app.module.ts

import { LoginComponent } from './login/login.component';

@NgModule({
   declarations: [
   AppComponent,    
   LoginComponent    
 ],
 imports: [
   FormsModule,
   BrowserModule,
   AppRoutingModule ,
   RouterModule   
 ],
 providers: [],
 bootstrap: [AppComponent]
 })

然后在app-routing.module.ts中

 import { LoginComponent } from './login/login.component';

  const routes: Routes = [  
       { path: 'login' , component:LoginComponent}
  ];

  @NgModule({
  imports: [
     CommonModule , RouterModule.forRoot(routes)
  ],
  exports: [ RouterModule ],
  declarations: []
  })

然后我添加了login.module.ts

 import { LoginComponent } from './login.component';

 declarations: [LoginComponent]

然后我设置了login.routing.module.ts

import { LoginComponent } from './login.component';
const routes: Routes = [
   { path:'' , component:LoginComponent }
];

我在app.component.html中设置了Login链接

<a href="/login">Login</a>

当我使用npm start命令运行我的应用程序并使用localhost：4200打开浏览器时，它将正确显示链接，但是当我点击该页面时，只需重新加载不在登录页面上重定向。

Answer 1

你想改变

<a href="/login">Login</a>

对此

<a routerLink="/login">Login</a>

另见Routing & Navigation - Router Links

Answer 2

你只需在app.module.js的import中添加它。

RouterModule.forRoot([
  {path:'login', component:LoginComponent}
])

并确保你的app.html有<router-outlet></router-outlet>

这个对我有用！

Answer 3

在你的app-routing.module请更新path这样。

 { path:'login' , loadChildren:'./login/login.module#LoginModule'}