我在我的angular应用程序中有3个组件- signin,markets和register。登录组件是我的平台组件。我在登录页面上有两个按钮--登录和注册。单击登录按钮将把我带到市场组件,单击注册按钮将把我带到注册组件。我可以在单击sign up后导航到注册组件,但在单击sign in后无法导航到markets组件。URL更改为localhost:4200/market,但未加载markets组件。登录组件保持原样。控制台中没有错误。组件的代码段已附加。
signin.component.html
<button type="button" class="btn btn-primary" [routerLink]="['../markets']">Sign in</button>
<button type="button" class="btn btn-secondary" [routerLink]="['../register']">Sign Up</button>
<router-outlet></router-outlet>
register.component.html
<button type="button" class="btn btn-primary" [routerLink]="['../signin']">Register</button>
<router-outlet></router-outlet>
app.component.html
<signin></signin>
app-routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { SigninComponent } from './signin/signin.component';
import { RegisterComponent } from './register/register.component';
import { MarketsComponent } from './markets/markets.component';
const routes: Routes = [
{ path: "signin", component: SigninComponent},
{ path: "register", component: RegisterComponent},
{ path: "markets", component: MarketsComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }

发布于 2020-10-25 02:50:07
在login组件/app组件中,在构造函数中注入路由器
// import { ActivatedRoute, Router } from '@angular/router';
constructor(private router: Router)当登录成功时,登录方法login()包含命令this.router.navigate。
发布于 2020-10-25 05:04:28
首先你的申请路由结构有一些不匹配,但是,我根据你的要求做了一个简单的路由,请检查下面的链接
https://stackblitz.com/edit/angular-ahleui?embed=1&file=src/index.html
https://stackoverflow.com/questions/64516792
复制相似问题