Присвоение значения вводу HTML типа date с Angular 4 - PullRequest
0 голосов
/ 11 сентября 2018

Я новичок в angular, но мне нужно назначить дату вводу html типа date при загрузке страницы.

Я заметил, что если вы измените тип ввода с даты на текст,значение присваивается входу, но оставляется как дата, значение не присваивается.

Кто-то может знать, где я иду не так.

Следуй за мной, код.

HTML

<input class="form-control" 
       type="date" 
       maxlength="10" 
       placeholder="dd/mm/yyyy"
       [(ngModel)]="carFilter.dataInicial"  
       (ngModelChange)="onDateChangeFim($event)"    
        min="{{auxFimMinDate}}"
        max="{{auxFimMaxDate}}">

Пример компонента

export class CarComponent implements AfterViewInit, OnInit {

    carFilter : CarModel;
    auxInMaxDate: Date  = new Date("2099-12-30");
    auxFimMinDate: Date  = new Date("1900-01-01");


    ngOnInit(): void {

        this.carFilter  = new CarModel();
        const data = new Date();        
        this.carFilter.dataInicial = data;

    }
}

Пример модели

export class CarModel {

    offSet : number;
    dataInicial : Date;
    dataFinal : Date;

    constructor(
                offSet:number,
                dataInicial : Date,
                dataFinal : Date
                ){

        this.offSet = offSet;
        this.dataInicial = dataInicial;
        this.dataFinal = dataFinal;     

    }
}

Ввод изображения

enter image description here

Консоль Google Chrome

enter image description here

Ответы [ 2 ]

0 голосов
/ 11 сентября 2018

Я смог решить проблему, назначив свой ngModel | дата: 'гггг-мм-дд'. Я должен изучить, почему это работает так. Если кто-то хочет прокомментировать или предложить что-то лучшее, я благодарю вас. Спасибо всем, кто помогал @Samy Sammour и @Dmitriy Snitko

<input class="form-control" 
   type="date" 
   maxlength="10" 
   placeholder="dd/mm/yyyy"
   [ngModel]="carFilter.dataInicial | date:'yyyy-MM-dd'"  
   (ngModelChange)="onDateChangeFim($event)"    
    [min]="auxFimMinDate"
    [max]="auxFimMaxDate">
0 голосов
/ 11 сентября 2018

Переменная date должна быть объектом от Date. не просто строка.

Вместо этого попробуйте добавить реальный объект:

this.carFilter  = new CarModel();
var data = new Date('10/09/2018');        
this.carFilter.dataInicial = data;

<input type="date" [(ngModel)]="carFilter.dataInicial" />
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...