如何在自定义组件中包含扩展另一个指令的指令

Question

我试图从本质上将一个组件和一个带有一些默认选项的指令组合到一个新的自定义组件中。

最初看起来像这样：

<input soho-input soho-mask [options]="maskOptions"...

我想通过创建一个名为integer-input的新组件来扩展soho-input组件，该组件还包括soho-mask指令和默认选项，以便其外观如下：

<input integer-input...

我目前所拥有的是这个，但是我无法弄清楚如何使它正常工作，现在很迷茫，找不到其他类似的帖子。

import { Component, ElementRef, OnInit, Inject, ViewChild } from '@angular/core';
import { SohoInputComponent, SohoMaskDirective, SohoMaskModule } from '../../../node_modules/ids-enterprise-ng';

@Component({
  selector:  'input[integer-input]', // tslint:disable-line
  template:  '<ng-content></ng-content>'
})
export class IntegerInputComponent extends SohoInputComponent implements OnInit {
  mask: SohoMaskDirective;

  private _patternOptions: SohoMaskPatternOptions = {
    allowDecimal: false,
    allowNegative: false,
    allowThousandsSeparator: false,
    integerLimit: 10
  };

  private _options: SohoMaskOptions = {
    process: 'number',
    patternOptions: this._patternOptions
  };

  constructor(@Inject(ElementRef) element: ElementRef) {
    super(element);
  }

  ngOnInit() {
    this.mask.options = this._options;
  }
}