#angular #datetime #ionic-framework #ionic3 #ngmodel
#угловатый #дата — время #ионный каркас #ionic3 #ngmodel #angular #datetime #ionic-framework
Вопрос:
Я создаю форму в приложении ionic 3 и ввожу дату рождения, используя ion-datetime. По какой-то причине конфиденциальности я не могу узнать год рождения людей. Но когда я устанавливаю формат ion-datetime с помощью DD MMMM. ngModel пуст, но когда у меня есть year, например, DD MMMM YYYY, он нормально получит пользовательский ввод. Могу ли я узнать, как это решить? ниже приведен мой код:
<ion-datetime displayFormat="DD MMMM" [(ngModel)]="formData.birthday"></ion-datetime>
И стакблитц:
https://stackblitz.com/edit/ionic-9q3aas?file=pages/about/about.html
Комментарии:
1. Это должно сработать, можете ли вы создать проблему, воспроизводимую stackblitz?
2. stackblitz.com/edit/… Спасибо за ответ @SivakumarTadisetti
Ответ №1:
Это действительно очень странная проблема!
Я думаю, что проблема связана с этой строкой кода исходного кода Ionic:
_inputNgModelEvent(): any {
return convertDataToISO(this.value);
}
Похоже, что Ionic пытается преобразовать выбранные значения в дату ISO, но если год отсутствует, то это недопустимая дата ISO. Одним из обходных путей было бы прослушивание ionChange
события напрямую, вот так:
<ion-header>
<ion-navbar>
<ion-title>
Test
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-item>
<ion-label>Value</ion-label>
<ion-datetime
displayFormat="DD MMMM"
(ionChange)="updateValues($event)" <--- here!
></ion-datetime>
</ion-item>
<ion-item>
<button ion-button (click)="printValues()">Show Result in Console</button>
</ion-item>
</ion-content>
И затем в вашем компонентном коде вы можете обработать это событие, чтобы получить выбранные значения:
import { Component } from '@angular/core';
@Component({
selector: 'page-test',
templateUrl: 'test.html'
})
export class TestPage {
public day: number;
public month: number;
updateValues(values: any) {
if(values) {
this.day = values.day;
this.month = values.month;
}
}
printValues() {
console.log(`day: ${this.day}`);
console.log(`month: ${this.month}`);
}
}
Пожалуйста, взгляните на обновленную демонстрацию stackblitz.