在Angular 7中，自定义验证器错误不会立即反映出来的问题通常是由于异步验证器引起的。异步验证器是一种在异步任务完成后进行验证的验证器。在这种情况下，表单验证会在异步任务完成之前完成，因此错误不会立即反映出来。

解决这个问题的方法是使用updateValueAndValidity方法手动更新表单控件的验证状态。这将触发异步验证器的重新运行，并在验证完成后更新错误状态。

以下是一个示例代码，演示了如何解决这个问题：

首先，创建一个自定义异步验证器：

import { AbstractControl, ValidationErrors, AsyncValidatorFn } from '@angular/forms';
import { Observable, of } from 'rxjs';
import { map, delay } from 'rxjs/operators';

export function customAsyncValidator(): AsyncValidatorFn {
  return (control: AbstractControl): Observable => {
    return of(control.value).pipe(
      delay(2000), // 模拟一个异步任务
      map(value => {
        if (value === 'admin') {
          return { customError: true }; // 返回自定义错误
        }
        return null;
      })
    );
  };
}

然后，在组件中使用这个自定义异步验证器：

import { Component } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { customAsyncValidator } from './custom-async-validator';

@Component({
  selector: 'app-root',
  template: `
    

      
      
自定义错误
    
  `
})
export class AppComponent {
  form: FormGroup;

  constructor(private fb: FormBuilder) {
    this.form = this.fb.group({
      username: ['', Validators.required, customAsyncValidator()]
    });
  }
}

在上面的代码中，我们使用customAsyncValidator作为username表单控件的异步验证器。当输入框中的值为"admin"时，将返回一个自定义错误。

最后，我们需要在异步任务完成后手动更新表单控件的验证状态。为此，我们可以在异步验证器中使用updateValueAndValidity方法：

export function customAsyncValidator(): AsyncValidatorFn {
  return (control: AbstractControl): Observable => {
    return of(control.value).pipe(
      delay(2000), // 模拟一个异步任务
      map(value => {
        if (value === 'admin') {
          control.setErrors({ customError: true }); // 设置自定义错误
        } else {
          control.setErrors(null); // 清除错误
        }
        control.updateValueAndValidity(); // 更新验证状态
        return null;
      })
    );
  };
}

通过使用control.setErrors设置错误，并使用control.updateValueAndValidity更新验证状态，我们可以确保自定义验证器错误立即反映出来。

希望这个示例代码能帮助你解决Angular 7中自定义验证器错误不立即反映出来的问题。