我使用 MatDialog 创建了一个模式。该模态可以从我的工具栏打开。
在模式中,我有一个用于登录和注册的选项卡式页面。这些是通过路由加载的单独组件。
现在我想关闭模式并在用户单击模式内的按钮时将用户重定向到另一个页面。链接已更新,但我的内容未显示!
navbar->modal<->LoginComponent/SignupComponent(此处的链接应关闭模式并重定向)
SignupComponent.ts:(位于模态框内)
registerBuisnessClicked() {
this.dialogRef.close('signup');
Run Code Online (Sandbox Code Playgroud)
}
导航栏.ts:
dialogRef.afterClosed().subscribe(result => {
if (result === 'signup') {
console.log('redirecting to signup');
this.router.navigate(['/signup']);
}
});
Run Code Online (Sandbox Code Playgroud)
为了进行测试,我在导航栏中创建了另一个工具栏项目,它直接路由到我的注册,这有效!
user() {
this.router.navigate(['/signup']);
Run Code Online (Sandbox Code Playgroud)
}
在我的模态中我有以下代码:
模态.html
<nav mat-tab-nav-bar mat-align-tabs="center">
<a mat-tab-link
(click)="switchToLogin()"
[active]="rla1">
Login
</a>
<a mat-tab-link
(click)="switchToRegister()"
[active]="rla2">
Register
</a>
</nav>
Run Code Online (Sandbox Code Playgroud)
模态.ts
constructor(private router: Router) { }
ngOnInit() {
this.router.navigate(['/login']);
this.rla1 = true;
this.rla2 = false;
}
switchToRegister() {
this.router.navigate(['/signup'], { replaceUrl: true });
this.rla1 = false;
this.rla2 = true; …Run Code Online (Sandbox Code Playgroud)