从 json 结果中填充选择选项

debugcn 发表于 Dev

YVS1102

我正在尝试为我的选择框填充选项。这是我所做的

创建ticket.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { MainproviderProvider } from '../../providers/mainprovider/mainprovider';

/**
 * Generated class for the CreateTicketPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-create-ticket',
  templateUrl: 'create-ticket.html',
})
export class CreateTicketPage {
  responseData : any;
  objectKeys = Object.keys;
  constructor(public navCtrl: NavController, public navParams: NavParams, public MainproviderProvider : MainproviderProvider) {

 }

  ionViewDidLoad() {
        this.MainproviderProvider.populateprobParent().then((result) => { 
            this.responseData = result;
         });
  }

}

这是我的create-ticket.html

<ion-header>

  <ion-navbar>
    <ion-title>CreateTicket</ion-title>
  </ion-navbar>

</ion-header>


    <ion-content padding>
      <ion-select [(ngModel)]="this.responseData" [required]="true" [name]="value">
            <ion-option *ngFor="let option of objectKeys(value)">
                {{ value[ProblemId] }} - {{ value[ProblemDesc] }}
            </ion-option>
        </ion-select>
    </ion-content>

但是当我运行它时，我收到此错误

Error: Uncaught (in promise): TypeError: Cannot convert undefined or null to object TypeError: Cannot convert undefined or null to object

这是我的 json 看起来像

{"parentData": [{"ProblemId":"PROB001","ProblemParent":null,"ProblemDesc":"Masalah Jaringan"},{"ProblemId":"PROB005","ProblemParent":null,"ProblemDesc":"Masalah Komputer"}]}

我错过了什么？我该如何解决？

萨吉塔兰

您需要在响应数据上使用 ngFor

<ion-select [(ngModel)]="select" [required]="true" [name]="value">
            <ion-option *ngFor="let optionObj of responseData.parentData">
                {{ optionObj?.ProblemId] }} - {{ optionObj?.ProblemDesc }}
            </ion-option>
</ion-select>

DEMO

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。