Get variable value from html in typescript ionic 2

Question

I'm writing a code but I can't get a value of a range from html page. I'm working on this(I want to set the brightness of a device) :

  <ion-item>
    <ion-range [(ngModel)]="BrightnessValue" color="dark" pin="true" step="1" min="0" max="10">
      <ion-icon range-left small name="sunny"></ion-icon>
      <ion-icon range-right name="sunny"></ion-icon>
    </ion-range>
  </ion-item>

In my ts :

......
  BrightnessValue: number ;
....
constructor(....){
console.log(this.BrightnessValue);
    Brightness.setBrightness(this.BrightnessValue);
}

But the value is always undefinde. So how can I send from html -> ts ?

sebaferreras · Accepted Answer · 2017-03-24 07:45:21Z

2

The value is undefined because it was not initialized and you're trying to get that value from the constructor. Try by using the ionChange event:

 <ion-item>
    <ion-range (ionChange)="changeBrightness()" [(ngModel)]="BrightnessValue" color="dark" pin="true" step="1" min="0" max="10">
      <ion-icon range-left small name="sunny"></ion-icon>
      <ion-icon range-right name="sunny"></ion-icon>
    </ion-range>
  </ion-item>

And in your code:

public changeBrightness(): void {
  console.log(this.BrightnessValue);
  Brightness.setBrightness(this.BrightnessValue);
}

answered Mar 24, 2017 at 7:45

sebaferreras

44.7k11 gold badges120 silver badges137 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

sebaferreras Over a year ago

Glad to hear that :)

Collectives™ on Stack Overflow

Get variable value from html in typescript ionic 2

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related