Question

从html传递数据时遇到问题

Karbohidrat :{{karbohidrat}} <button ion-button (click)="cekHalamanMakanan('karbohidrat')">Lihat makanan karbohidrat</button> <br>

并使用cekHalamanMakanan函数接收karbohidrat

cekHalamanMakanan(value)
  {
   }

当我尝试console.log时，它给了我正确答案
然后我想将值推送到这样的数组并使用navctrl

将数组发送到下一页

gizi : any;    
this.gizi= {};
        this.gizi = this.navParams.data;
        this.karbohidrat=this.gizi.karbohidrat;
        this.protein_hewani=this.gizi.protein_hewani;
        this.protein_nabati=this.gizi.protein_nabati;
        this.lemak=this.gizi.lemak;
        this.jenis=this.gizi.value;

并使用navparams

接收它

this.makanan = {}
    this.makanan = this.navParams.data;
    this.variabel = this.makanan.jenis;

但是当我尝试使用console.log看到它时，它给了我＆＃34; undefined＆＃34; ..

继承完整代码

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { AngularFireAuth } from 'angularfire2/auth';
import { AngularFireDatabase} from 'angularfire2/database';
import { HalamanmakananPage} from '../halamanmakanan/halamanmakanan'

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

@Component({
  selector: 'page-rekomendasi',
  templateUrl: 'rekomendasi.html',
})
export class RekomendasiPage {
  gizi : any;
  karbohidrat : number;
  protein_hewani : number;
  protein_nabati : number;
  lemak : number;
  jenis : string;
  value : string;

  constructor(public navCtrl: NavController, public navParams: NavParams) {

  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad RekomendasiPage');
  }

  cekHalamanMakanan(value)
  {
    console.log(value);

    this.gizi= {};
    this.gizi = this.navParams.data;
    this.karbohidrat=this.gizi.karbohidrat;
    this.protein_hewani=this.gizi.protein_hewani;
    this.protein_nabati=this.gizi.protein_nabati;
    this.lemak=this.gizi.lemak;
    this.jenis=this.gizi.value;
    console.log(this.karbohidrat,this.protein_hewani,this.protein_nabati,this.lemak,this.jenis);

    this.navCtrl.push(HalamanmakananPage,this.gizi);
  }

}

Answer 1

在这个函数中，除了将其记录到控制台之外，您似乎永远不会最终使用传入的值（＆＃39; karbohidrat＆＃39;）。您正在执行的所有其他操作仅使用在加载页面时传递给NavParams的内容。

cekHalamanMakanan(value)
  {
    console.log(value);

    this.gizi= {};
    this.gizi = this.navParams.data;
    this.karbohidrat=this.gizi.karbohidrat;
    this.protein_hewani=this.gizi.protein_hewani;
    this.protein_nabati=this.gizi.protein_nabati;
    this.lemak=this.gizi.lemak;
    this.jenis=this.gizi.value;
    console.log(this.karbohidrat,this.protein_hewani,this.protein_nabati,this.lemak,this.jenis);

    this.navCtrl.push(HalamanmakananPage,this.gizi);
  }

使用打字稿传递数据

1 个答案: