ion-select-option selected属性不起作用

时间:2019-09-01 22:20:46

标签: angular typescript ionic-framework select

selected =“ m.selected”在页面打开时将选择框显示为空白,即使该值为True。 (在离子4和5中会遇到此问题。)

details.page.html

<ion-item mode="ios">
     <ion-label>Unit</ion-label>
    <ion-select [(ngModel)]="selectedModel" mode="ios" interface="action-sheet">
       <ion-select-option *ngFor="let m of details?.unit" [value]="m" [selected]="m.selected">{{m.title}}</ion-select-option>
     </ion-select>
  </ion-item>

<div *ngIf="selectedModel">
<div>
{{selectedModel.name}}
</div>
...
 </div>

details.page.ts

selectedModel:any;
  constructor(private route:ActivatedRoute, private unitService: UnitService) { }

  ngOnInit() {
    let index = this.route.snapshot.paramMap.get('index');
    this.unitService.getUnDetails(index).subscribe(details =>{
      console.log('Details:', details);
      this.details = details;
    })
  }

}

data.json

[
    {
        "id":1,
        "name":"Food",
        "img":"food.jpg",
        "gm":"gr",
        "vitc":"0",
        "vita":"0.04",
        "unit":[
            {
                "i":1,
                "selected":"true",
                "title":"Full",
                "name":"Joe",
                "amount":"25"
            },
            {
                "i":2,
                "selected":"false",
                "title":"Half",
                "name":"Brad",
                "amount":"150"
            }
        ]
    },
    ...
   ]

如何获取选择的第一个值?我正在从Api获取数据。

1 个答案:

答案 0 :(得分:1)

编辑

尝试将selectedModel设置为ngOnInit中的选定值。像这样:

this.selectedModel = this.details.unit.find(u => u.selected);

我没有关于this.details.unit变量的完整信息,所以我假设有一些信息。