Angular 9: потомки абстрактного компонента не наследуют его атрибуты

Question

У меня есть модуль, в котором есть компоненты с похожими атрибутами, поэтому я создал абстрактный компонент MyFilter<T>, который имеет набор атрибутов с декоратором @Injectable. После обновления до Angular 9 я получаю предупреждения в консоли

Невозможно привязать к «форме», так как это не известное свойство «my-text-filter».

и ошибки, потому что дочерние компоненты не распознают атрибуты родителя. Вот некоторый код:

@Injectable()
export abstract class MyFilter<T> {

  @Input() form: FormGroup;
  @Input() filterOpened: boolean;
  @Input() enableSubmit: boolean;
  @Output() filterUsed = new EventEmitter<T>();

  abstract useFilter();
}

и вот дочерний компонент:

@Component({
  selector: 'my-text-filter',
  templateUrl: './text-filter.html',
  styleUrls: ['./text-filter.scss']
})
export class MyTextFilter extends MyFilter<TextFilter> implements OnInit, OnChanges {

  constructor() {
    super();
  }

  ngOnInit() {
    this.form.get('value').valueChanges.pipe( // ERROR: cannot find 'get' of undefined
        debounceTime(50)
    ).subscribe(() => this.useFilter());
  }

  ngOnChanges(changes: SimpleChanges) {
    console.log(changes) // this doesn't get logged in the console, 
                         // even if I comment out what's in ngOnInit
  }

  useFilter() {
  }

}

Answer 1

Вам нужно использовать декоратор @Directive, чтобы иметь возможность расширять его из другого компонента:

@Directive()
export abstract class MyFilter<T> {

  @Input() form: FormGroup;
  @Input() filterOpened: boolean;
  @Input() enableSubmit: boolean;
  @Output() filterUsed = new EventEmitter<T>();

  abstract useFilter();
}