when you select January, you want the page replacement data to be January volunteer data, but after clicking, the browser log can display the January data, but the page data is not changed.

log

html page

<ion-header>
    <ion-toolbar color="danger">
      <ion-buttons>
        <button ion-button navPop icon-only>
          <ion-icon ios="ios-arrow-back" md="md-arrow-back"></ion-icon>
        </button>
      </ion-buttons>
      <ion-buttons style="background: transparent;" end> 
        <button style="background: transparent;" (click)="doRadio()"></button>
      </ion-buttons>
        <ion-title text-wrap></ion-title>
    </ion-toolbar>
</ion-header>

<ion-content>

  <ion-grid>
    <ion-row>
      <ion-col>
        <ion-card (click)="goToVolunteerVoteDetail(volunteer)" style="width:26%" class="pin" *ngFor="let volunteers of volunteer">
          <img src="{{volunteers.Preview_image1}}" height="100">
          <div *ngIf="volunteers.title" class="volunteer-title">
            <small>{{volunteers.title}}</small>
          </div>
          <div class="volunteer-title">{{volunteers.like_number}}</div> <!-- :505x505px -->
        </ion-card>
      </ion-col>
    </ion-row>
  </ion-grid>
</ion-content>

ts page

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";
// import { VolunteerVotePopPage } from "../volunteer-vote-pop/volunteer-vote-pop";


@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();
  }


}

provide page

getVolunteerVote() {
    return new Promise(resolve => {
      this.http.get("http://servertrj.com/api/news/index/16?api_key=123").map(res => res.json().data).subscribe(data => {
          this.data = data;
          resolve(this.data);
        });
    });
  }
  getVolunteerVote1() {
    return new Promise(resolve => {
      this.http.get("http://servertrj.com/api/news/index/22?api_key=123").map(res => res.json().data).subscribe(data => {
          this.data = data;
          resolve(this.data);
        });
    });
  }