Hello, I try to get the default value of my Input.
> <ion-item>
> <ion-input [(ngModel)]="firstname" type="text" value="{{firstname.value}}"></ion-input>
> </ion-item>
When I try: alert(firstname); it will give me a “undefined”. So how can I get this value?
Thank you.
did you set the default value in your component?
public firstname: string = 'John';
and then you don’t need
value="{{firstname.value}}"I am getting the default value from an array from the server and output it in the input. So I can not set the default value in the component I think.
The default value is visible in the input and if I change one letter in the input from the default value, then alert(firstname); works… But if I change nothing alert(firstname); will show me undefined.
I am not getting this one, so confusing 
Then define component variable without any value
public firstname: string;
and when you get the result from the server just set the response value to the this.firstname
That makes no difference 
Let’s suppose I have this code:
<ion-input [(ngModel)]="firstname" type="text" value="John"></ion-input>
The default value is ‘John’ and I don’t want to define ‘John’ in the component. I want to get the value from [(ngModel)]="firstname" like I do when I write something in the input.
But it simply seems that it will never output ‘John’ but ‘undefined’ like there was no default value, even though it is output in the input form.
How exactly are you calling the alert?
Simply with alert(this.firstname); , as I said, it works when I write something in the input, then it shows the value, but it will never show the default value.
What I meant is the context. Could you share some more code?
Correct me if I’m wrong… You are trying to get default value from server and set it to the firstname input…
Remove value=“John”… You don’t need it.
<ion-input [(ngModel)]="firstname" type="text"></ion-input>
In the component define new variable without a value
public firstname: string;
then get data from the server for example in onInit function
ngOnInit() {
this.userService.getDefaultValues().then(response => {
this.firstname = response.firstname;
alert(this.firstname);
} );
}Yes, that is true, but I want to keep the value in the
<ion-input [(ngModel)]="firstname" type="text" value="{{server_response}}"></ion-input> and extract that default value “{{server_response}}” to the component.
I just thought that it should work to call alert(this.firstname); and immediately get the default value. Example:
<ion-input [(ngModel)]="firstname" type="text" value="John"></ion-input> here, calling alert(this.firstname); should show me the value “John” but it actually shows “undefined” as it doesn’t get the value.
It should work the same as if I write something in the input, and then call alert(this.firstname);. Like if I write Hello in the input, it shows me “Hello”…
I think that it’s then not possible to get the default value from
<ion-input [(ngModel)]="firstname" type="text" value="{{firstname.value}}"></ion-input>
What I think that happens is that you are asking for the function and right after that you are triggering the value. But when your software asks for the value of this.firstname, it takes more time than to go to the next line. You have to have a .then () function in order to catch the value and be able to do something with it.
Input is part of a component so you just set default value in that component…
As RaulGM mentioned server doesn’t return response data immediately… it takes a few milliseconds to get the data from a server but alert happens immediately… so you have to wait until server returns that data and then you can set it to the input or alert it…
If you look at my example code above you can see .then() function and inside of this function I use response data and set it to the input through member variable… So this should work… I don’t understand why you need to set firstname directly on the input… When you set it to a member variable and “assign” that variable to the input through [(ngModel)]=“firstname” it should populate the input immediately after server returns expected data…
hello all,
how do i the value returned from sqlite data as value of an ion-input i tried but
in application it shows [object promise] in ion-input. cal any one help?
i am using database service for getting the value.
loadJobno() {
this.database.executeSql(‘SELECT * FROM job_data ORDER BY job_no DESC LIMIT 1’, )
.then(data => {
console.log(JSON.stringify(data));
// tslint:disable-next-line:prefer-const
let job = 0;
if (data.rows.length === 0) {
job = job + 1;
console.log(job);
return job;
} else {
job = data.rows.item(0).job_no + 1;
console.log(job);
return job;
}
});
and my page.ts is
ngOnInit() {
this.jobdate = new Date().toISOString();
this.db.getDatabaseState().subscribe(ready => {
if (ready) {
this.product = this.db.getProducts();
this.jobno = this.db.loadJobno();
}
});
}
Declare return types (not any) for every function you write, and then TypeScript itself will guide you through misunderstandings like the one underlying this problem.