Ignite UI for Angular 9.1.2 バージョン時点での情報に基づいています。
Ignite UI for Angular 9.1で、INPUT要素にIgxDateTimEditorディレクティブを指定できるようになりました。
入力形式を設定するには、IgxDateTimeEditorディレクティブに文字列として渡します。
// app.module.ts
// ... (省略) ...
// IgxDateTimeEditorModuleとIgxInputGroupModuleをインポートをする。
import { IgxDateTimeEditorModule, IgxInputGroupModule } from 'igniteui-angular';
@NgModule({
declarations: [
AppComponent
],
imports: [
// ... (省略) ...
IgxDateTimeEditorModule,
IgxInputGroupModule,
],
// ... (省略) ...
})
// ... (省略) ...
// app.component.ts
// ... (省略) ...
export class AppComponent {
// ... (省略) ...
public date = new Date();
// ... (省略) ...
}
<!-- app.component.html --> <igx-input-group> <!-- INPUT要素にIgxDateTimeEditorディレクティブを指定し、入力形式を渡す --> <input type="text" igxInput [igxDateTimeEditor]="'yyyy/MM/dd HH:mm:ss'" [value]="date" /> </igx-input-group>
実行結果

サンプル
リファレンス
- 「Date Time Editor ディレクティブ」