我试图基本上将组件和指令与一些默认选项组合到一个新的自定义组件中 .
最初它看起来像这样：
<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;
}
}