微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

角度 – 离子选择Ionic 2中的动态选项?

我正在开发Ionic 2中的应用程序.我需要以动态的方式添加离子选择选项,但我对可能非常简单的事情感到难过.这是我的代码片段.

<ion-select [(ngModel)]="classifications" (ngModelChange)="updateSelectedValue($event)">
 <ion-option *ngFor="#key of classifications" value="key" [checked]="true">{{key}}</ion-option>
this.classifications = this.local.get('classifications')._result;
    console.log('classifications: '+ this.local.get('classifications')._result);


updateSelectedValue(event:string):void {
   this.selectedobject = JSON.parse(event);
   console.log('selectedobject: '+this.selectedobject);
}

控制台日志的输出

classifications: ["Any","Agriculture,Forestry,And Fishing","Mining","Construction","Manufacturing","Transportation,Communications,Electric,Gas,And Sanitary Services","Wholesale Trade","Retail Trade","Finance,Insurance,And Real Estate","Services","Public Administration "]

我也得到了例外.

EXCEPTION: Cannot find a differ supporting object '["Any","Public Administration "]' in [classifications in JobsearchPage@30:17]

编辑:

它没有设定其选择的价值.我在Angular 1中做过这个.

<select id="classificationId"  data-role="listview" data-inset="true" ng-options="classification as classification for classification in classifications " ng-model="classification" x-ng-change="update(classification)">
<option value=''>Classifications</option></select><select id="classificationId" data-role="listview" data-inset="true" ng-options="classification as classification for classification in classifications " ng-model="classification" x-ng-change="update(classification)"><option value=''>Classifications</option></select>

编辑(从评论到答案)

export class JobsearchPage { 
    selectedClassification:string; 
    constructor(http: Http,nav: NavController,messagesService:MessagesService,navParams:NavParams) { 
      this.http = http;
      this.messagesService = messagesService; 
      this.nav = nav; 
      this.classifications = new Array("t9it",'uitut');
      console.log('STP selected'+selectedClassification); 
  } 
}

解决方法

我不使用Ionic但是我很确定ngModel应该指向一个包含(或被赋予)所选选项的字段而不是整个可能的选项列表

<ion-select [(ngModel)]="selectedClassification" (ngModelChange)="updateSelectedValue($event)">
 <ion-option *ngFor="#key of classifications" value="key" [checked]="true">{{key}}</ion-option>
class MyComponent {
  selectedClassification:string;
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐