angular - 除非填写表格，否则角度保持在同一页面上

Question

用户登录后，他们进入表单。其中有名称和用户名。

http://localhost:4200/form

我希望用户填写表格，然后重定向到任何其他页面。我如何确保即使用户更改了网址，除非他们填写表格，否则他们不会去任何地方。

应用程序路由.module.ts

  {
    path: "create-profile/:username",
    component: profileComponent,
    canActivate: [AuthGuard]
  },

现在，当用户登录时，它会转到此组件。

submit(form: any) {
    this.username = form.username;
    this.name= form.name;
    this.auth.changePassword(form).subscribe(data => {
      this.snackBar.open("profile created", "close", {
        duration: 3000
      });
    });
  }

现在在这之后我不知道我该怎么办？我还是角度的新手

标签： angular

Answer 1

您的解决方案将是一个两步过程：

1. 创建一个服务来存储表单的状态。例如：有效/无效。一个常见的场景是维护用户是否已登录、具有访问权限等。

2. 为其他路线创建一个路线保护，并使用#1 中的服务检查表单的状态以允许/禁止导航。

请查看https://angular.io/guide/router#milestone-5-route-guards