Question

可以停用警卫队。

是否有可能在离开组件时，canDeactivate不仅渲染带有“是/否”的确认窗口，而且导航到另一个组件？像这样：

canDeactivate(): Observable<boolean> | Promise<boolean> | boolean {
if (this.registrationService.isRegistered()) {
  return true;
} else {
  if (!confirm('If you do not register, your data will be lost. Click Cancel to go to Registration page.')) {
    console.log('before');
    this.router.navigate(['register']); // <----
    console.log('after');
    return false;
  } else { return true; }
}

}

现在不起作用。单击“取消”时，一次又一次打开确认窗口，并且在控制台中分别为：“之前”，“之后”。仅在首先单击“取消”然后单击“确定”时，才重定向到注册页面。

更新：看来我用PROMISE解决了这些问题

private isCanDeactivate: boolean;
canDeactivate(): Observable<boolean> | Promise<boolean> | boolean {
 if (this.registrationService.isRegistered()) {
   return true;
 } else {
   if (!confirm('If you do not register, your data will be lost. Click Cancel to go to Registration page.')) {
     console.log('press Cancel');
     this.retrieve().then(() => this.afterPromise());
     return this.isCanDeactivate;
   } else {
     console.log('press Ok');
     return true; }
  }
}

private retrieve(): Promise<any> {
 return new Promise((resolve) => {
   this.retrieveDataResolver = resolve;
   this.setIsCanDeactivate();
 });
}

private setIsCanDeactivate(): void {
 this.isCanDeactivate = true;
 this.retrieveDataResolver();
}
private afterPromise() {
 this.router.navigate(['register']);
}

有人可以提供更好的解决方案吗？

Answer 1

假设 register 组件路径为“ register”，则可以通过以下方式进行

this.router.navigateByUrl('register');

您还可以使用location.back()导航到最后一页。

import {Component} from '@angular/core';
import {Location} from '@angular/common';

@Component({
  selector: 'app-login',
  templateUrl: './login.page.html',
  styleUrls: ['./login.page.scss'],
 })
class LoginPage {

  constructor(private location: Location) 
  {}

  onBackClicked() {
    this.location.back();
  }
}

在canDeactivate方法中添加导航

1 个答案: