typescript 将值从组件传递到另一个组件

Posted 2021-05-20

import { LuckyPickModel } from "../models/luck-pick";
import { Observable, of as observableOf, BehaviorSubject, Subject } from "rxjs";

export class LuckyPickService {
    private luckyPicks: LuckyPickModel[] = [];
    majorDraws = [];
    minorDraws = [];
    refresh = new Subject(); <---- initialize

    addItem(icon: string, category: string, combinations: string, isMajor: boolean) {
        this.luckyPicks.push(new LuckyPickModel(icon, category, combinations, isMajor));
    }

    getItems() {
        return this.luckyPicks.slice();
    }

    clear() {
        this.luckyPicks = [];
    }

}

import { Component, OnInit } from '@angular/core';
import { IonicPage, NavController, NavParams, ModalController } from 'ionic-angular';
import { LuckyPickModel, GameModesModel } from '../../models/luck-pick';
import { LuckyPickService } from '../../services/lucky-pick';
import { BetNowPage } from '../modal/bet-now/bet-now';
import { ScrollHideConfig } from '../../directives/scroll-hide/scroll-hide';

@Component({
  selector: 'page-lucky-pick',
  templateUrl: 'lucky-pick.html',
})

export class LuckyPickPage implements OnInit {
               
   //use to hide header when scrolled
  footerScrollConfig: ScrollHideConfig = { cssProperty: 'margin-bottom', maxValue: undefined };
  headerScrollConfig: ScrollHideConfig = { cssProperty: 'margin-top', maxValue: 190 }; 

  gameModes: GameModesModel[] = [
                        {icon: "lotto_ultra.jpg", category: "Grand Lotto 6/58", isMajor: true},
                        {icon: "lotto_grand.jpg", category: "Grand Lotto 6/55", isMajor: true},
                        {icon: "lotto_649.jpg", category: "Super Lotto 6/49", isMajor: true},
                        {icon: "lotto_645.jpg", category: "Mega Lotto 6/45", isMajor: true},
                        {icon: "lotto_642.jpg", category: "Lotto 6/42", isMajor: true},
                        {icon: "lotto_6digit.jpg", category: "6Digit", isMajor: false},
                        {icon: "lotto_4d.jpg", category: "4Digit", isMajor: false},
                        {icon: "lotto_3d.jpg", category: "Swertres Lotto 11AM", isMajor: false},
                        {icon: "lotto_3d.jpg", category: "Swertres Lotto 4PM", isMajor: false},
                        {icon: "lotto_3d.jpg", category: "Swertres Lotto 9PM", isMajor: false},
                        {icon: "lotto_2d.jpg", category: "EZ2 Lotto 11AM", isMajor: false},
                        {icon: "lotto_2d.jpg", category: "EZ2 Lotto 4PM", isMajor: false},
                        {icon: "lotto_2d.jpg", category: "EZ2 Lotto 9PM", isMajor: false}
                      ]; 

  luckPick: any = [];
  majorGames: any = [];
  minorGames: any = [];
  numbers: number[] =  [];
  doRefresh: boolean;

  constructor(
    public navCtrl: NavController, 
    public navParams: NavParams,
    private luckyPickService: LuckyPickService,
    private modalCtrl: ModalController) {
  }

  ngOnInit() {
    this.setup();
    this.segregateGames();
    
    
    this.luckyPickService.refresh.subscribe((data) => { <--- this is the method for getting the data from other component
      console.log('doRefresh', data);
      this.refresh();
    });
  }

  segregateGames() {    
    this.majorGames = [];
    this.minorGames = [];
    for(let i = 0; i < this.luckPick.length; i++) {
        if(this.luckPick[i].isMajor) {
            this.majorGames.push(this.luckPick[i]);
        } else {
            this.minorGames.push(this.luckPick[i]);
        }
    }
  }

  setup() {        
    this.luckyPickService.clear();
    for(let i of this.gameModes) {            
        this.luckyPickService.addItem(i.icon, i.category, this.assignLuckyNumbers(i.category), i.isMajor);      
    }

    this.getLuckyPicks();
  }

  refresh() {            
      this.setup();
      this.segregateGames();      
  }

  getLuckyPicks() {          
    this.luckPick = this.luckyPickService.getItems();
    console.log(this.luckPick);
  }

  assignLuckyNumbers(i: string) {
    if (i == "Grand Lotto 6/58") {
      return this.getLuckyNumbers(1,58,6,0);

    } else if (i == "Grand Lotto 6/55") {
        return this.getLuckyNumbers(1,55,6,0);

    } else if (i == "Super Lotto 6/49") {
        return this.getLuckyNumbers(1,49,6,0);

    } else if (i == "Mega Lotto 6/45") {
        return this.getLuckyNumbers(1,45,6,0);

    } else if (i == "Lotto 6/42") {
        return this.getLuckyNumbers(1,42,6,0);

    } else if (i == "6Digit") {
        return this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,0);

    } else if (i == "4Digit") {
        return this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,0);

    } else if (i == "Swertres Lotto 11AM") {
        return this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,0);

    } else if (i == "Swertres Lotto 4PM") {
        return this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,0);

    } else if (i == "Swertres Lotto 9PM") {
        return this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,1) + this.getLuckyNumbers(0,8,1,0);

    } else if (i == "EZ2 Lotto 11AM") {
        return this.getLuckyNumbers(1,31,1,1) + this.getLuckyNumbers(1,31,1,0);

    } else if (i == "EZ2 Lotto 4PM") {
        return this.getLuckyNumbers(1,31,1,1) + this.getLuckyNumbers(1,31,1,0);

    } else {
        return this.getLuckyNumbers(1,31,1,1) + this.getLuckyNumbers(1,31,1,0);

    }
  }

  getLuckyNumbers(start: number, num: number, length: number, yes: number): string {
      var randomNum:string = "";      
      var i: number = 0;
      var j: number;
      var k: number;
      var comma: string = " - ";
      var comma2: string = "";

      for(j = start; j <= num; j++){
          this.numbers.push(i + j);
      }

      this.shuffle(this.numbers);
      for(k = 1; k <= length; k++){
          if(k == length){
              comma = "";
          }
          if(yes == 1){
              comma2 = " - ";
          }
          randomNum = randomNum + this.numbers[k].toString() + comma + comma2;
      }
      return randomNum;
  }

  shuffle(array) {
    var currentIndex = array.length, temporaryValue, randomIndex;
  
    // While there remain elements to shuffle...
    while (0 !== currentIndex) {
  
      // Pick a remaining element...
      randomIndex = Math.floor(Math.random() * currentIndex);
      currentIndex -= 1;
  
      // And swap it with the current element.
      temporaryValue = array[currentIndex];
      array[currentIndex] = array[randomIndex];
      array[randomIndex] = temporaryValue;
    }
  
    return array;
  }

  openBet() {
    const modal = this.modalCtrl.create(BetNowPage);
    modal.present();
  }

}

import { Component } from '@angular/core';
import { ScrollHideConfig } from '../../directives/scroll-hide/scroll-hide';
import { ModalController } from 'ionic-angular';
import { BetNowPage } from '../modal/bet-now/bet-now';
import { SearchModal } from '../modal/search/search';
import { LuckyPickService } from '../../services/lucky-pick';

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

    homeSegment: string;

    constructor(
        private modalCtrl: ModalController,
        private luckypickService: LuckyPickService) { this.homeSegment = 'daily-results'; }

    fabClicked() {
        if(this.homeSegment == 'daily-results'){
            this.openBetModal();
        } else {
            this.refreshLuckyPicks();
        }
    }

    openBetModal() {
        const modal = this.modalCtrl.create(BetNowPage);
        modal.present();
    }

    refreshLuckyPicks() {
        this.luckypickService.refresh.next(true); <----- setting value that was initialized in lucky-pick.service.ts
    }

    openModalSearch() {
        const modalSearch = this.modalCtrl.create(SearchModal);
        modalSearch.present();
    }

}