Angular ionic3通过无线电更改页面数据`

当我单击'1'时月' 意思是“一月”，我想让离子网格显示一月的志愿者数据。console.log已获得正确的数据，但ion grid未更新

这是登录web浏览器

html页面

---

你总是在ngFor的志愿者中循环，但之后不会改变它的值确认 点击按钮

我建议您添加一个selected志愿者字段来保存所选月份的数据，并循环显示所选数据。并在需要时替换其值确认 按钮被点击

<ion-card (click)="goToVolunteerVoteDetail(volunteer)" style="width:26%" class="pin" *ngFor="let volunteers of selectedVolunteer">

export class VolunteerVotePage {
  selectedVolunteer: [];             // keep selected data here

  getVolunteerVote(): Promise<any> {
    return this.newsData.getVolunteerVote().then(data => {
      this.volunteer = data;
      this.selectedVolunteer = data;     // show January data be default;
    });
  }

  doRadio() {

    alert.addButton({
      text: '确认',
      handler: (data: any) => {
        console.log('Radio data:', data);
        this.selectedVolunteer = data;
      }
    });
    alert.addButton('取消');

    alert.present();
  }
}

---

请参阅。

您总是在ngFor的志愿者中循环，但之后不会更改其值确认 点击按钮。这很好，但我想将GetVolunterVote设置为默认值，而不是将GetVolunterVote1设置为数据。当我选择Jan时显示Jan数据。感谢you@YuyangHe好吧，我误解了你的功能，尽管你仍然可以修复。或者，如果您不介意丢失志愿者的原始数据，也可以用选定的数据替换志愿者：-当然……现在已经为我工作了，但是我怎么能在ts文件中设置其他月份呢？@YuyangHe对不起，设置其他月份是什么意思？在alertCtrl中设置它们？哥们忙完了看下微信 有个小问题请教

import { Component } from '@angular/core';
import { NavController, NavParams, ToastController, AlertController, ModalController } from 'ionic-angular';
import { NewsDataProvider } from '../../providers/news-data/news-data';
import { VolunteerVoteDetailPage } from '../volunteer-vote-detail/volunteer-vote-detail';


@Component({
  selector: 'page-volunteer-vote',
  templateUrl: 'volunteer-vote.html',
})
export class VolunteerVotePage {
  volunteer:any;
  volunteer1:any;
  //volunteer2:any;
  // testRadioOpen = false;
  // testRadioResult: any;

  constructor(
    public navCtrl: NavController, public navParams: NavParams,
    public newsData:NewsDataProvider,public toastCtrl: ToastController,
    public alertCtrl: AlertController,public modalCtrl: ModalController
  ){
    this.getVolunteerVote();
    this.getVolunteerVote1();
    //this.getVolunteerVote2();
  }

  getVolunteerVote(): Promise<any> {
    return this.newsData.getVolunteerVote().then(data => {
      this.volunteer = data;
    });
  }
  getVolunteerVote1(): Promise<any> {
    return this.newsData.getVolunteerVote1().then(data => {
      this.volunteer1 = data;
    });
  }
  // getVolunteerVote2(): Promise<any> {
  //   return this.newsData.getVolunteerVote2().then(data => {
  //     this.volunteer2 = data;
  //   });
  // }

  goToVolunteerVoteDetail(volunteerItem:any) {
    this.navCtrl.push(VolunteerVoteDetailPage,{
      volunteer:volunteerItem
    });
  }

  doRadio() {
    const alert = this.alertCtrl.create();
    alert.setTitle('请选择月份');

    alert.addInput({
      type: 'radio',
      label: '1月',
      value: this.volunteer1,
      checked: true
    });

    // alert.addInput({
    //   type: 'radio',
    //   label: '2月',
    //   value: this.volunteer2
    // });

    alert.addButton({
      text: '确认',
      handler: (data: any) => {
        console.log('Radio data:', data);
        // this.testRadioOpen = false;
        // this.testRadioResult = data;
      }
    });
    alert.addButton('取消');

    alert.present();
  }


}

getVolunteerVote() {
    return new Promise(resolve => {
      this.http.get('http').map(res => res.json().data).subscribe(data => {
          this.data = data;
          resolve(this.data);
        });
    });
  }
  getVolunteerVote1() {
    return new Promise(resolve => {
      this.http.get('http').map(res => res.json().data).subscribe(data => {
          this.data = data;
          resolve(this.data);
        });
    });
  }

<ion-card (click)="goToVolunteerVoteDetail(volunteer)" style="width:26%" class="pin" *ngFor="let volunteers of selectedVolunteer">

export class VolunteerVotePage {
  selectedVolunteer: [];             // keep selected data here

  getVolunteerVote(): Promise<any> {
    return this.newsData.getVolunteerVote().then(data => {
      this.volunteer = data;
      this.selectedVolunteer = data;     // show January data be default;
    });
  }

  doRadio() {

    alert.addButton({
      text: '确认',
      handler: (data: any) => {
        console.log('Radio data:', data);
        this.selectedVolunteer = data;
      }
    });
    alert.addButton('取消');

    alert.present();
  }
}