Angular 7 - динамически добавлять директиву

<input  {{field.validatorDirective}} 
        class="form-control" 
        [ngClass]="{ 'border-danger': hasErrors }" 
        (keyup)="callback()" 
        [formControlName]="field.key" 
        [id]="field.key"
        [type]="field.type" 
        [placeholder]="field.placeholder" 
        [value]="field.value">

field содержит весь необходимый контент, но я хотел бы динамически добавлять используемое имя директивы.

В настоящее время он добавлен как string как field.validatorDirective

Это ошибка

TextComponent.html:2 ERROR DOM Exception: Не удалось выполнить setAttribute для элемента Element: {{field.validatorDirective}} не является допустимым именем атрибута.

В моей директиве есть селектор usernameValidator


angular angular7
person ngDough    schedule 23.11.2018    source источник
comment
{{field?.validatorDirective}} попробовать так?   -  person programoholic    schedule 23.11.2018
comment
Нет, ты не можешь этого сделать.   -  person JB Nizet    schedule 23.11.2018
comment
Я добавил имя директивы usernameValidator, которое передается как field.validatorDirective   -  person ngDough    schedule 23.11.2018
comment
Это может помочь --› stackoverflow. ком/вопросы/41298168/   -  person Bunyamin Coskuner    schedule 23.11.2018

Ответы (1)


arrow_upward
3
arrow_downward

Кажется, ты не можешь этого сделать. Я пробовал с [attr.directiveSelector]="condition", но и с этим не работает.

Обходной путь (если он вас интересует) состоит в том, чтобы иметь два входа с *ngIf на обоих. Что-то вроде этого:

<input  directive1
    *ngIf="condition1"
        class="form-control" 
        [ngClass]="{ 'border-danger': hasErrors }" 
        (keyup)="callback()" 
        [formControlName]="field.key" 
        [id]="field.key"
        [type]="field.type" 
        [placeholder]="field.placeholder" 
        [value]="field.value">

<input directive2
    *ngIf="condition2"
    class="form-control" 
    [ngClass]="{ 'border-danger': hasErrors }" 
    (keyup)="callback()" 
    [formControlName]="field.key" 
    [id]="field.key"
    [type]="field.type" 
    [placeholder]="field.placeholder" 
    [value]="field.value">
person SiddAjmera    schedule 23.11.2018