【问题标题】:How to access the value of ion options in ion-select multiple如何在 ion-select multiple 中访问离子选项的值
【发布时间】:2019-04-21 05:12:44
【问题描述】:

我正在尝试使用 ion-select multiple 来获取选定的值及其字符串..

以前我使用 ion-checkbox 尝试过这个并且工作过

<ion-item *ngFor="let day of alarm.alarmDays">
        <ion-label>{{day.name}}</ion-label>
        <ion-checkbox [(ngModel)]="day.value"></ion-checkbox>
</ion-item>

但是,当我尝试以下方法时,它并没有产生奇迹..

<ion-item>
  <ion-label>Days</ion-label>
     <ion-select multiple="true" >  
      <ion-select-option *ngFor="let day of alarm.alarmDays" name="day.name" [(ngModel)]="day.value">{{day.name}}</ion-select-option>
     </ion-select>
</ion-item>

这个错误来了

ERROR CONTEXT
ERROR TypeError: Cannot read property 'value' of undefined

这是对象

alarm: Alarm = {
    alarmEnabled: true,
    alarmCreatedBy: "",
    alarmTitle: "",
    alarmTime: "",
    alarmDays:  [
         {
            name: 'Monday',
            value: false,
         },
         {
            name: 'Tuesday',
            value: false,
         },
         {
            name: 'Wednesday',
            value: false,
         },
         {
            name: 'Thursday',
            value: false,
         },
         {
            name: 'Friday',
            value: false,
         },
         {
            name: 'Saturday',
            value: false,
         },
         {
            name: 'Sunday',
            value: false,
         },
       ]
    };

我希望能够从 ion-select 多重检索值和字符串,我希望看到纠正我的英语的最小努力,除非你真的不明白......

【问题讨论】:

  • @KhurshidAnsari thx 但它仍然给出与上述相同的错误
  • 您对 ng-model 有疑问
  • 现在我删除了 ngmodel 输入,我无法将值用于 firebase 任何想法? [forum.ionicframework.com/t/…

标签: angular firebase ionic4


【解决方案1】:

在 html(主页)中:

<ion-item *ngFor="let x of testData">
        <ion-label>{{x.name}}</ion-label>
        <ion-checkbox [checked]="x.value" ></ion-checkbox>
</ion-item>


<ion-item>
  <ion-label>Gender</ion-label>
  <ion-select multiple="true">
    <ion-option *ngFor="let x of testData" [selected]="x.value"> {{x.name}} </ion-option>
  </ion-select>
</ion-item>
</ion-content>

在组件中(主页):

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  public testData;

  constructor(public navCtrl: NavController) {
    this.testData = [
      {
        name: "a", 
        value: true
      }, 
      {
        name: "b", 
        value: true
      }
    ];
  }
}

运行演示:link

【讨论】:

  • 我面临着解决在组件中分配的类似问题
  • 第一种方法仍然给出了相同的错误ERROR CONTEXTERROR TypeError: Cannot read property 'value' of undefined 仍然在解决第二个代码正在尝试的问题
  • 第一种方法,因为模型。您已经在组件中声明了属性,然后才没有通过该错误
  • 我无法在您的第二种方法中访问 alarmDays...它显示名称 alarmDays not found
  • 带上你的闹钟,我做了傻瓜
猜你喜欢
  • 2020-08-24
  • 1970-01-01
  • 2012-08-03
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多