使用Angular 17在编辑表单中绑定保存的日期

本地日期时间例外输入类似 2024-07-05T09:42:00 ,所以我们可以对其进行转换以满足要求。

ngOnInit() {
    this.checkOut.runDate = this.checkOut?.runDate?.split('.')?.[0];
}

完整代码:

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { bootstrapApplication } from '@angular/platform-browser';
import 'zone.js';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [FormsModule, CommonModule],
  template: `
   <input type="datetime-local" [(ngModel)]="checkOut.runDate">
   <br/>
   {{checkOut.runDate | date:"long"}}
  `,
})
export class App {
  checkOut: any = {
    runDate: '2024-07-05T09:42:00.000Z',
  };

  ngOnInit() {
    this.checkOut.runDate = this.checkOut?.runDate?.split('.')?.[0];
  }
}

bootstrapApplication(App);

Stackblitz Demo