Javascript 使用Firebase的角度异步表单验证

我正在尝试实现一个表单验证，它检查Firebase上是否存在用户名。如果没有，则表单将无效

当我使用可观察的对象模拟数据时，表单验证工作正常。但是，当我从Firebase获取数据时，它不起作用

这是有效的：

fromMockData(username: string): Observable<Usernames> {
  return username === 'demo' ? Observable.of({ uid: 'test' }) : Observable.of(null);
}

fromFirebase(username: string): Observable<Usernames> {
  return this.afs.doc(`usernames/${username}`).valueChanges();
}

---

因为Firebase返回数据流，所以我需要使用，以便只发出第一项：

fromFirebase(input: FormControl): Observable<{[key: string]: any}> {
  return this.service.fromFirebase(input.value).pipe(
    first(),
    map(user => user ? { invalidUsername: `@${input.value} already exists` } : null),
  );
}

fromFirebase（输入：FormControl）：可观察{
返回此.service.fromFirebase（input.value）.pipe(
第一个（），
映射（user=>user？{invalidUsername:`@${input.value}已存在`}:null），
);
}

this.form = this.fb.group({
  username: ['', [], [this.validator.fromFirebase.bind(this.validator)]],
});

fromFirebase(input: FormControl): Observable<{[key: string]: any}> {
  return this.service.fromFirebase(input.value).pipe(
    first(),
    map(user => user ? { invalidUsername: `@${input.value} already exists` } : null),
  );
}