要解决Angular自定义响应式表单验证器不起作用的问题，你可以按照以下步骤进行操作：

1. 创建自定义验证器函数：

   import { AbstractControl, ValidatorFn } from '@angular/forms';
   
   export function customValidator(): ValidatorFn {
     return (control: AbstractControl): { [key: string]: any } | null => {
       // 在这里实现自定义验证逻辑
       // 如果验证失败，返回一个包含错误消息的对象
       // 如果验证通过，返回null
       return control.value === 'valid' ? null : { invalid: true };
     };
   }
   

2. 在组件中导入自定义验证器函数并将其应用于表单控件：

   import { Component } from '@angular/core';
   import { FormBuilder, FormGroup, Validators } from '@angular/forms';
   import { customValidator } from './custom-validator';
   
   @Component({
     selector: 'app-my-form',
     templateUrl: './my-form.component.html',
     styleUrls: ['./my-form.component.css']
   })
   export class MyFormComponent {
     myForm: FormGroup;
   
     constructor(private fb: FormBuilder) {
       this.myForm = this.fb.group({
         myField: ['', [Validators.required, customValidator()]]
       });
     }
   }
   

3. 在模板中显示验证错误消息：

   
     
     
   
       错误消息：字段无效
     
   
   

通过以上步骤，你可以创建并应用自定义验证器函数，并在模板中显示相应的错误消息。请根据你的实际需求进行相应的自定义验证逻辑的实现。