how to get html element value using ionic 2
Below my html code
<div class="messagesholder" *ngFor="let chat of chatval | orderby:'[date]'" >
<div *ngIf="chat.sender == currentuser || chat.receiver == currentuser">
<div *ngIf="chat.date" style="text-align: center;" >
<p style="font-size:9px;" id="amount" #amount>{{chat.date | amDateFormat:'LL'}}</p>
<input #myname [ngModel]="range" (ngModelChange)="saverange($event)"/>
<input #myname type="text" value={{chat.date}}>
</div>
</div>
<div class="message" *ngIf="chat.sender == currentuser || chat.receiver == currentuser" [ngClass]="{'me': currentuser == chat.sender}">
<div class='image' *ngIf="chat.path" >
<img *ngIf="chat.path" [src]="chat.path"/><br>
<span *ngIf="chat.path_text">{{chat.path_text}}</span>
<span style="font-size:9px;">{{chat.date | amDateFormat:'hh:mmA'}}</span>
</div>
<div *ngIf="chat.message_text">
<span>{{chat.message_text}}</span>
<span style="font-size:9px;">{{chat.date | amDateFormat:'hh:mmA'}}</span>
</div>
</div>
Below my ts file
import { Component,Inject,ViewChild,ElementRef,AfterViewInit} from '@angular/core';
export class ChatPage implements AfterViewInit {
@ViewChild('myname') input:ElementRef;
constructor(public modalCtrl: ModalController,public navCtrl: NavController) {}
ngAfterViewInit() {
console.log(this.input.nativeElement.value);
}
}
Same date values are repeated.I want same date values are not repeated.
Because I will check two variable.
so I need chat.date value.because i binded the value of input.But i cannot get the value of input element.
i am getting this error
Cannot read property 'nativeElement' of undefined
How to fix this issue.or any other way to find slutions.
Thanks
To get the value of an input element in TypeScript: Select the input element. Type the input element as HTMLInputElement using a type assertion. Use the value property to get the element's value.
I created a plnkr link: https://plnkr.co/edit/49TEP8lB4lNJEKsy3IDq?p=preview
It works for me so probably you may want to create your own plnkr so ppl can help
export class ApiDemoApp{
root = ApiDemoPage;
@ViewChild('myname') input:ElementRef;
constructor() {
}
ngAfterViewInit() {
console.log(this.input.nativeElement.value);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With