获取生成的隐藏字段的值

Question

I'm using the Datepicker from angular2-materialize, it is based on Pickadate, and I need to send a different value to the server than what is displayed to the user. Classical case. For this, Pickadate provides an option : formatSubmit which creates an hidden input which holds that internal value. I'm even able to have this input having the same name that my main input (with hiddenName parameter).

<input type="date" id="dateOfEvent" name="dateOfEvent" 
       [(ngModel)]="claimFile.dateOfEvent" class="datepicker" 
       materialize="pickadate" [materializeParams]="[{format: 'd mmmm yyyy', formatSubmit: 'yyyy-mm-dd', hiddenName: true}]" required />

That generates an hidden input below the component :

<input type="hidden" name="dateOfEvent" value="2016-10-20">

The problem is that hidden input is not binded to my ng2 model. How can I do that ? If it isn't possible, how can I get a way to access the value of my hidden input ? thx a lot

Answer 1

<input type="hidden" #hidden name="dateOfEvent" value="2016-10-20">

@ViewChild('hidden') hidden:ElementRef;

ngAfterViewInit() {
  console.log(this.hidden.nativeElement.value);
}

If it is not possible to add a template variable to the hidden element

consturctor(private elRef:ElementRef){}

ngAfterViewInit() {
  console.log(this.elRef.querySelector('input[type="hidden"]').value);
}