Angular 检查注册表上的字段是否唯一的最佳方法是什么？

我正在构建一个项目，其中我还使用Spring构建服务器端，使用angular构建客户端

在客户端有一个注册表，要求用户填写电子邮件和密码

由于电子邮件对于连接到系统至关重要，因此它必须是唯一的。 因此，在服务器端，我定义了当客户机试图插入一封已经存在的电子邮件时，他将得到一个异常

因为我不希望客户端发送返回错误的请求，所以我创建了一个服务器端函数来检查是否已经有一个客户端包含用户输入的返回true或false的电子邮件。 我确定一旦用户使用模糊事件在电子邮件输入框中输入完一个值，该功能就会被激活。 问题是启用的函数是异步的，允许用户在返回答案之前发送表单

怎么办？如何检查唯一字段是否已经存在？

---

提醒我，我使用angular 7，在angular环境中使用的不是被动形式，而是标准形式。。。使用反应形式可能是最简单的

如果您有如下组件模板：

<div [formGroup]="registrationForm'>
  <input type="email" formControlName="email">
  <input type="password" formControlName="password">
  <button type="submit" (click)="register()">Register</button>
</div>

---

欢迎来到Stackoverflow，@ChayMizrahi！我可以告诉你，如果你不包括你已经尝试过的，你可能不会在这方面找到太多帮助。人们非常乐意帮助别人解决一些问题，但不太愿意仅仅为别人做工作。从统计上看，用户重复发送电子邮件的可能性很小。甚至在大型网站上。因此，在提交表单时，只需将其作为拒绝后处理。让服务器返回一个回复，说电子邮件已经存在，然后从那里接收。对我来说，执行早期异步验证来解决这样一个罕见的问题简直是过火了。例如，您可以禁用表单提交按钮，直到您知道电子邮件尚未使用为止。但无论你做什么，在你检查完唯一性之后，在提交表单之前，总有可能有其他人使用相同的电子邮件注册。但是考虑到用户无论如何都应该有一封独特的电子邮件，我同意Reactgular。您将通过实际验证用户是否确实拥有该电子邮件地址来确认注册，对吗（即发送确认电子邮件并等待确认）？仅供参考如果您使用反应式表单，则表单在异步验证完成之前不会注册为有效，如果你想在任何情况下都能在角度上发展，那么学习如何有效地使用反应形式是值得的。谢谢大家的评论。用户将插入其字段之一必须唯一的任何对象。我用了一封电子邮件的例子，只是为了让大家更容易理解我。显然，我应该更详细，并给出一个更具体的例子。在任何情况下，我似乎别无选择，只能学习一点反应形式
export class RegistrationComponent {
  registrationForm: FormGroup;

  private uniqueEmail() {
    return (ctrl: AbstractControl) => { // this is how you define a validator function
      let email = ctrl.value;
      return (value) // async validators return an Observable or Promise
        ? this.checkUniqueEmail(email).pipe(
            map(isUnique => (isUnique) ? null : {emailNotUnique: true})
          ) // validators return null if they're valid, otherwise some object
        : of(null); // don't bother checking if no value
    }
  }

  private checkUniqueEmail(email) {
    // whatever your actual uniqueness checker is here, 
    // must return Observable<boolean> in this example
    let params = new URLSearchParams();
    params.append("email", email);
    return this.http.get<boolean>('https://example.com/check-unique-email', {search: params});
  }

  constructor(private fb: FormBuilder, private http: HttpClient) {
    this.registrationForm = this.fb.group({
      email: ['', {
        validators: [Validators.required, Validators.email], // sync validators, these are both angular built in's
        asyncValidators: [this.uniqueEmail()], // this is how you use a validator
        updateOn: 'blur' // run validation on blur
      }],
      password: ['', [Validators.required, Validators.minLength(8)]] // short hand declare validators
    });
  }

  register() {
    if (this.registrationForm.valid) {
      // async validation done and form valid, do the save
    } else {
      // form is not valid or async validation in flight
    }
  }
}