角度5动态加载指令

这个想法很枯燥,因为我的应用程序中有20多个表单,我发现我到处都在重复相同的DOM代码,因为所有的表单控件显然基本相同,包含DOM和错误显示逻辑也相同。因此,我在表单输入中创建了一个单独的组件。

组件HTML来演示我的意思

<div [formGroup]="iFormGroup">
    <ng-container *ngFor="let validation of formInputValidations">
        <div *ngIf="GLOBALS.doINeedToShowFieldError( iFormControlName, validation.validatorStr, iFormGroup, formSubmitted, true )"
             class="error-box error-box--brand-popup scale-show">
            {{ _formInputErrorTextService.getFormFieldErrorText( validation.errorMsgId ) }}
        </div>
    </ng-container>

    <div class="input-wrap">
        <input type="text"
               class="input"
               [(ngModel)]="iNgModel"
               formControlName="{{ iFormControlName }}"
        />
        <label>{{ title }}</label>
    </div>  
</div>

我被困在哪里了?

一切正常,但我需要开始向输入动态添加指令。这意味着一些输入需要有一个货币掩码,例如,所以我想添加一个输入选项,aka。 isCurrency: boolean ,如果这是一种货币,我想在输入中添加一个输入掩码指令。

<input type="text"
       class="input"

       --> currencyMask <--

       [(ngModel)]="iNgModel"
       formControlName="{{ iFormControlName }}"
        />

这样地。

我知道angular不支持动态更改/添加指令,但是有没有办法在组件引导期间添加它们?比如说一个ngIf之类的。

我试着做一个 *ngSwitch="FormInputType.CURRENCY"

有什么好办法吗?