'How do I map a `datetime-local` form control value to an epoch time property and back in Angular Reactive Forms?
I have an underlying data object that represents a timestamp property as a number representing milliseconds since Epoch.
export class Activity {
constructor(
public timestamp: number=0,
) {}
}
I have a form with a FormControl for that form input field.
activityForm = new FormGroup({
timestamp: new FormControl('', [
Validators.required,
]),
});
I want to use the HTML datetime-local type to view and edit this field (where "local" is UTC)
<input
class="form-control"
type="datetime-local"
id="inputTimestamp"
formControlName="timestamp"
/>
A datetime-local control expects, and produces, the date time as an ISO String, not an epoch timestamp.
I have two functions defined in my component;
toDatetime(timestamp: number) { return new Date(timestamp).toISOString().slice(0, 16);}
and
fromDatetime(datetime: string) { return new Date(datetime).getTime(); }
How do I hook these up to the form field to do two-way conversion? Or can it only be done during ngOnInit() and onSubmit()?
Update*:
In an ideal world, I'd like to simply save this.activityForm.values in my onSubmit() function, expecting that timestamp is accurately calculated and saved, without manually copying object properties.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
