Question

我有这样的表单控件：

<input formControlName="myName" dynamicDisable>

然后是自定义指令：

 @Directive({
    selector: '[formControlName][dynamicDisable]
 })
 export class DynamicDisableDirective implements AfterContentInit {

      @ContentChild(AbstractControlDirective) control: any;

      ngAfterContentInit(): void {
        console.log(this.control);
      }
    }

我想将指令所有者元素作为@ContentChild注入指令。所有者元素可以是任何类型的表单控件，如简单的FormControl，FormGroup甚至FormArray。 FormControlName是AbstractControlDirective的后代。为什么控制台总是记录'undefined'呢？

注意：当我像这样切换NgControl的AbstractControlDirective时：

@ContentChild(NgControl) control: any;

一切都按预期工作，表单控件实例被注入并记录良好。但是，此方法只能用于简单的FormControl，而不能用于组和数组。

Answer 1

据我所知，AbstractControlDirective没有提供任何内容，因此如果没有进一步的帮助，查询或注入一个将无法正常工作。

我还没有尝试，但可能会注册像

这样的别名提供商

@Directive({
    selector: '[formControlName][dynamicDisable],
    providers: [
     { provide: AbstractControlDirective, useExisting: FormControl, useMulti: true },
     { provide: AbstractControlDirective, useExisting: FormGroup, useMulti: true },
    ]
})

使用useMulti: true，您可以（对所有人）获取一个列表，如果有多个匹配，然后根据您的实际需要过滤列表。

将AbstractControlDirective实例作为@ContentChild注入自定义指令

1 个答案: