Mat-datepicker - Как показать сохраненное пользователем значение в поле ввода - [(ngModel)]

я не знаю, чего именно не хватает. но не могу найти способ решить проблему.

У меня есть Mat-datepicker - пользователь выбирает дату и сохраняет ее. даты успешно сохранены. но когда вернусь, чтобы увидеть изменения. даты там нет.

Ясно, что я хочу показать дату, сохраненную пользователем в mat-datepicker.

<div class="end-date">              
                <mat-form-field>
                    <input matInput [matDatepicker]="myDatepicker"  name="appEndDate" [value] = "appEndDate" [(ngModel)]="appEndDate">
                    <mat-datepicker-toggle matSuffix [for]="myDatepicker"></mat-datepicker-toggle>
                    <mat-datepicker #myDatepicker></mat-datepicker>
                  </mat-form-field>
          </div>

in ts.

 appEndDate: string;

    ngOninit(){
    this.appEndDate = this.someService['appoinementDetails'].endDate;

}

Я не понимаю из официального документа о методе получения значения.

Решение: иногда (... редко) очистка кеша браузера может вам помочь. в моем сценарии. недавно сохраненные значения не обновляются в модели, и в ней были обнаружены нежелательные нежелательные значения, которые я использовал для сохранения в некоторых других полях формы.


angular angular-material ngmodel
person Mr. Learner    schedule 11.04.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

https://stackblitz.com/edit/angular-xjfnhk

вам просто нужно связать его с помощью или [(ngModel)], value или formcontrol.

В вашем случае дата, вероятно, не отображается, потому что она в неправильном формате. ты мог бы положить

appEndDate = new Date(this.someService['appoinementDetails'].endDate);

Я получил код здесь.

person Vato    schedule 11.04.2019
comment
я не знаю, почему ваше решение не работает у меня. в приложении. это привязка только к текущей дате. всякий раз, когда я меняю дату и сохраняю ее. это успешно сохраняется - person Mr. Learner; 11.04.2019
comment
Я не мог понять, что не работает правильно? проверьте красное поле формы. Я обновил stackblitz. вот что вам нужно. - person Vato; 11.04.2019
comment
хорошо. чтобы быть ясным. если я выберу любую дату и сохраню ее в локальном хранилище. как читать и показывать то же сохраненное значение в поле ввода datepicker. - person Mr. Learner; 11.04.2019
comment
привет, спасибо за потраченное время ... я исправил ... это просто глупая проблема с кешем в браузере ... - person Mr. Learner; 11.04.2019
comment
Подскажите, пожалуйста, как интегрировать эту ссылку с моими. Я хочу, чтобы пользователь вводил свои данные в любом приемлемом формате в поле ввода и то же самое, что и в поле зрения - person Mr. Learner; 12.04.2019
comment
не уверен, что вы пытаетесь сделать. но вы можете использовать angular datepipe для отображения даты в любом формате. как {{yourDate | date: 'dd / mm / yy'} вы можете указать любой формат вместо 'dd / mm / yy'. - person Vato; 12.04.2019
comment
проверьте мой stackblitz html. посмотрите ‹h1› appEndDate в конце. - person Vato; 12.04.2019
comment
да, это нормально .. я сделал это. я хочу. я хочу разрешить пользователю редактировать дату вручную, как они хотят .ex: если пользователь указывает 02 / апр / 2019 или 02-апр-2019 в mat-input, тогда это должно быть отображается в моем представлении без каких-либо изменений, если я печатаю {{appEndDate}} - person Mr. Learner; 12.04.2019
comment
ваш обновленный stackblitz дает мне Ваша дата: 21 00 19, когда я даю appEndDate = new Date('20Apr2019'); - person Mr. Learner; 12.04.2019
comment
angular.io/api/common/DatePipe проверьте это. Я не знаю, как делать то, что ты хочешь. Я бы рекомендовал сохранить один формат. вы сделаете это более сложным, чем нужно. Я изменил формат даты в stackblitz. просто проверьте, как вы можете изменить дату изменения формата: '' для выбранного вами формата. - person Vato; 12.04.2019