Более чем один пользовательский метод доступа к значениям сопоставляет элемент управления формы с неопределенным атрибутом имени - PullRequest
Новая
       27

Более чем один пользовательский метод доступа к значениям сопоставляет элемент управления формы с неопределенным атрибутом имени

0 голосов
/ 11 октября 2019

Я использую «Ng Date Time Picker» для ввода даты с помощью ввода текста. Но я не могу заставить его работать, используя "mask =" 00/00/0000 00:00 ", если пользователь пытается отредактировать выбранную дату в календаре.

Если пользователь пытается отредактировать ввод, вВ текущем сценарии ввод позволит вводить любые символы.

И я получаю сообщение об ошибке «Более одного средства доступа к пользовательским значениям соответствуют элементу управления формы с неопределенным атрибутом имени« как только я добавлю »mask =» 00/00/000000:00 "на мой ввод.

Есть ли что-то еще, что я мог бы попробовать?

https://github.com/angular/angular/issues/16755

Я пробовал решение выше, но созданная мною директива победилане задумывайтесь о моем мнении.

Вход 

        <input 
            [(ngModel)]="dataAgendamento" 
            [owlDateTimeTrigger]="dataAgn" 
            [owlDateTime]="dataAgn"
            [owlDateTimeFilter]="noWeekend"
            #dataAg="ngModel"
            (ngModelChange)="setDataAgn(dataAg)" 
            required
            mask="00/00/0000 00:00"  
            type="text" 
            style="width: 160px; padding: 7px" 
            placeholder="00/00/0000 00:00">

Директива 

   import { Directive, ElementRef, OnDestroy } from '@angular/core';
   import * as textMask from '../../../node_modules/vanilla-text mask/dist/vanillaTextMask.js';

   @Directive({
       selector: '[appMaskDate]'
   })

   export class MaskDateDirective implements OnDestroy {

   mask = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/]; // dd/mm/yyyy
   maskedInputController;

  constructor(private element: ElementRef) {
       this.maskedInputController = textMask.maskInput({
         inputElement: this.element.nativeElement,
         mask: this.mask
   });
 }

 ngOnDestroy() {
     this.maskedInputController.destroy();
 }

}

Вход с директивой 

        <input 
            [(ngModel)]="dataAgendamento" 
            [owlDateTimeTrigger]="dataAgn" 
            [owlDateTime]="dataAgn"
            [owlDateTimeFilter]="noWeekend"
            #dataAg="ngModel"
            (ngModelChange)="setDataAgn(dataAg)" 
            required
            appMaskDate 
            type="text" 
            style="width: 160px; padding: 7px" 
            placeholder="00/00/0000 00:00">
...