使用controlValueAccessor的自定义组件-ts-Lint错误:组件在定义前就已使用

时间:2020-07-26 09:39:55

标签: angular tslint controlvalueaccessor

这是我在RatingInputComponent的@component装饰器中使用的提供程序。

providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => RatingInputComponent),
      multi: true
    }
  ]

我遇到了ts-lint错误:在定义之前使用了'RatingInputComponent'。但是 forwardRef 允许引用尚未定义的引用。

我正在使用Angular 9.1.3

整个ts文件。

import { Component, forwardRef, Input } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';

@Component({
    selector: 'rating-input',
    templateUrl: './rating-input.component.html',
    styleUrls: ['./rating-input.component.scss'],
    providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => RatingInputComponent),
            multi: true
        }
    ]
})
export class RatingInputComponent implements ControlValueAccessor {
    @Input() items: string[];
    @Input() defaultText = 'Select Item';

    public value: string;
    public isDisabled: boolean;

    private onChange;

    registerOnChange(fn: any): void {
        this.onChange = fn;
    }

    registerOnTouched(fn: any): void {
    }

    setDisabledState(isDisabled: boolean): void {
        this.isDisabled = isDisabled;
    }

    writeValue(value: any): void {
        this.value = value;
    }

    selectItem(item): void {
        this.onChange(item);
        this.value = item;
    }
}

enter image description here 任何指导表示赞赏。

1 个答案:

答案 0 :(得分:0)

打字稿代码有效,似乎是短绒毛的问题。您可以通过设置"no-use-before-declare": false禁用此皮棉规则。