CODEWITHSUNDEEP
angular
Mohammed Ajmal
Mohammed Ajmal

Reputation: 590

How to use string interpolation in html "value" attribute

I use the below to generate date in component.ts file:

this.myDate=new Date();

And try to use in html form value field.But nothing is loaded.I have tried both the below syntax but not succesful

<input type="datetime" class="form-control" id="date" value={{this.myDate}} name="created" ngModel>

<input type="datetime" class="form-control" id="date" [value]=[this.myDate] name="created" ngModel>

One more issue is that my json file is upadted with only empty string after add operation

Upvotes: 3

Views: 7181

Answers (2)

Vash72
Vash72

Reputation: 622

You are missing the right date format for the input type datetime that is ="2017-06-01T08:30"

in the component.ts

formatted_date:string;

ngOnInit(){
//your code...
this.formatted_date = this.myDate.toISOString();
this.formatted_date.slice(0,16);
}

In the template.html (change the type to datetime-local beacuse datetime is Obsolete MDN Doc)

<input type="datetime-local" class="form-control" id="date" value="{{formatted_date}}" name="created">

Upvotes: 1

Martin Parenteau
Martin Parenteau

Reputation: 73721

It works if you remove the ngModel directive (see this stackblitz):

<input type="datetime" class="form-control" id="date" value="{{myDate}}" name="created">
<input type="datetime" class="form-control" id="date" [value]="myDate" name="created">

An alternative is to set the value with [ngModel] (see this stackblitz):

<input type="datetime" class="form-control" id="date" [ngModel]="myDate" name="created">

Upvotes: 0

Related Questions