我在ionViewDidLoad期间分配了一个对象,但是该对象仍然为空

时间:2018-09-06 02:57:35

标签: ionic-framework ionic2 ionic3

我是Ionic的新手,尝试将navParams传递到其他页面时遇到此问题。我想将团队对象 TeamHomePage 传递到 TeamDetailPage 。但我总是得到 null 。我已经签入ionViewDidLoad,并对其进行控制台以确保已分配团队对象,并尝试(成功)传递测试对象。任何人都不知道团队的目标何时到达?

<ion-tabs>
  <ion-tab tabTitle="Team" [root]='teamDetailTab' [rootParams]='testing' tabIcon="basketball"></ion-tab>
  <ion-tab tabTitle="Standings" [root]='standingsTab' [rootParams]='team' tabIcon="podium"></ion-tab>
</ion-tabs>

TeamHomePage.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { TeamDetailPage } from '../team-detail/team-detail';
import { StandingsPage } from '../standings/standings';

@Component({
  selector: 'page-team-home',
  templateUrl: 'team-home.html',
})
export class TeamHomePage {
  public team: any = {}
  public teamDetailTab = TeamDetailPage
  public standingsTab = StandingsPage
  public testing: any = {id:1, content: 'testing'}

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

  ionViewDidLoad() {
    this.team = this.navParams.data
    console.log('TeamHomePage navParams.data:')
    console.log(this.navParams.data)
    console.log('TeamHomePage this.team:')
    console.log(this.team)
  }

  goHome() {
    this.navCtrl.popToRoot()
  }

}

TeamDetailPage.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { EliteApi } from '../../providers/elite-api/elite-api';
import { GamePage } from '../game/game';

import * as _ from 'lodash'


@Component({
  selector: 'page-team-detail',
  templateUrl: 'team-detail.html',
})
export class TeamDetailPage {
  public team: any = {}
  public games: any[]
  private tourneyData: any

  constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    private eliteApi: EliteApi
   ) {}

  ionViewDidLoad() {
    this.team = this.navParams.data
    this.tourneyData = this.eliteApi.getCurrentTourney()
    this.games = _.chain(this.tourneyData.games)
                  .filter(g => g.team1Id === this.team.id || g.team2Id === this.team.id)
                  .map(g => {
                    let isTeam1 = (g.teamId === this.team.id)
                    let opponentName = isTeam1 ? g.team2: g.team1
                    let scoreDisplay = this.getScoreDisplay(isTeam1, g.team1Score, g.team2Score)
                    return {
                      gameId: g.id,
                      opponent: opponentName,
                      time: Date.parse(g.time),
                      location: g.location,
                      locationUrl: g.locationUrl,
                      scoreDisplay: scoreDisplay,
                      homeAway: (isTeam1 ? "vs.": "at")
                    }
                  })
                  .value()
                  console.log('TeamDetail team:')
                  console.log(this.navParams.data)
                  console.log('TeamDetail: tourneyData')
                  console.log(this.tourneyData)
                  console.log('TeamDetail touerneyData.games:')
                  console.log(this.tourneyData.games)
  }

  getScoreDisplay(isTeam1, team1Score, team2Score) {
    if (team1Score && team2Score) {
      var teamScore = (isTeam1 ? team1Score : team2Score)
      var opponentScore = (isTeam1 ? team2Score : team1Score)
      var winIndicator = teamScore > opponentScore ? 'W: ' : 'L: '
      return winIndicator + teamScore + '-' + opponentScore
    }else {
      return ''
    }
  }

空团队对象显示在控制台镶边中

enter image description here

0 个答案:

没有答案