CODEWITHSUNDEEP
angularionic-frameworkionic2
Madpop
Madpop

Reputation: 725

how to get value from ion-select and display in label

I am dynamically binding the drop-down and here I am unable to display the value which is selected by default label and also if I change the selection that value is also not displaying in the label.

Below is my code

 <p>{{locName}}</p>
    <ion-grid style="background:#fafafa">
      <ion-row>
        <ion-col col-6 hidden>
          <!--<ion-label>Location</ion-label>-->
          <ion-select #sectionSelect [(ngModel)]="location" (ngModelChange)="optionsFn()"  hidden>
            <ion-option *ngFor="let opt of allowedData" [value]="opt.LocationId">{{opt.LocationName}}</ion-option>
          </ion-select>
        </ion-col>

      </ion-row>

    </ion-grid>

in the locName I have to display the selected data

below is my typescript code 

optionsFn(){
    this.dataone = location;
    this.locName = this.dataone.LocationName;
    console.log(this.locName);

  }

Upvotes: 0

Views: 2408

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222572

It should be as follows,

optionsFn(){
    this.dataone = this.location;
    this.locName = this.dataone.LocationName;
    console.log(this.locName);
}

or pass the ngModel value to the function in HTML

(ngModelChange)="optionsFn(location)"

and in TS

 optionsFn(value:any){
        this.dataone = value;
        this.locName = this.dataone.LocationName;
        console.log(this.locName);
    }

Upvotes: 1

Related Questions