Директива Mask в Angular 2 не работает при просмотре груза

0

Я сделал несколько директив маски в Angular 2, один из них - для почтового индекса. В основном он работает, но при загрузке данных в HTML он работает только тогда, когда фокус находится на входе, имеющем директиву. Я пробовал помещать различные события в хост, но никто не работал. Я пытался использовать изменения, ввод, но никто не работал.

HTML:

вход имеет директиву (название директивы: cep)

<div class="col-sm-4">
        <div class="form-group fg-line">
            <label for="cep">CEP</label>
            <input type="text" class="form-control input-sm" id="cep" placeholder="CEP" required [(ngModel)]="empresa.Cep" borda-animada
                cep maxlength="9" ngControl="cep" #cep="ngForm">
        </div>
    </div>

Директива:

import {Directive} from '@angular/core';
import {NgModel} from '@angular/common';
import {Mascaras} from '../core/mascaras'

@Directive({
    selector: '[ngModel][cep]',
    providers: [NgModel],
    host: {
        '(blur)': 'onInputChange($event)',
        '(input)': 'onInputChange($event)'
    }
})
export class CepDirective {
    modelValue: string;
    viewValue: string;

constructor(public model: NgModel) {}

onInputChange(event) {
  console.log('teste ngmodelchange');

  //event é o evento html que é disparado no evento blur
  //por isso precisa pegar o target.value.
  var newValue = Mascaras.cep(event.target.value);
  this.model.valueAccessor.writeValue(newValue);       
  }
}
  • 0
    Я думаю, что использование пользовательского ControlValueAccessor будет правильным подходом.
  • 0
    У вас есть пример?
Показать ещё 2 комментария
Теги:
angular

1 ответ

0

Если вы предоставляете NgModel в директиве, он получает новый экземпляр, введенный вместо существующего.

Эта строка должна быть удалена:

providers: [NgModel],

Поле ввода маски в формах Angular2 показывает полный пример.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню