從組件中的異步服務中檢索數據

Question

我從異步服務的功能中檢索Firebase中的數據，並且希望在我的組件中檢索它們。

我有我的數據庫中的數據，該函數很好地返回我的數據，但我不能在我的home.ts（數組爲空）中檢索它們。

todolistService.ts：

import {Injectable} from '@angular/core'; 
import {AngularFireDatabase, FirebaseListObservable} from 'angularfire2/database'; 
import * as moment from 'moment'; 
import 'rxjs/add/operator/map'; 
import {Observable} from "rxjs/Observable"; 

@Injectable() 
export class TodolistService { 

    statuts: Array<any> = []; 
    dateOfTheDay: string; 

    constructor(public afDB: AngularFireDatabase) { 
    moment.locale('fr'); 
    this.dateOfTheDay = moment().format('L'); // Date au format : 04/07/2017 
    } 

    /** 
    * 
    * @returns {Observable<Array<any>>} 
    */ 
    statusToShow():Observable<Array<any>> { 
    let localStatuts: Array<any> = []; 
    return this.afDB.list('/statut').map(status => { 
     for (let s of status) { 
     if (this.dateOfTheDay === s.statut_date_tache) { 
      if (s.statut_id_tache in this.statuts === false) { 
      localStatuts[s.statut_id_tache] = s; 
      console.log('=== STATUSTOSHOW ==='); 
      console.log(localStatuts); 
      return localStatuts; 
      } 
     } 
     } 
    }); 
    } 
} 

home.ts：

import {Component} from '@angular/core'; 
import {ModalController, NavController} from 'ionic-angular'; 
import {TodolistService} from "../../providers/todolistService"; 

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

    public statusOfTheDay: Array<any> = []; 

    constructor(public navCtrl: NavController, public modalCtrl: ModalController, public todolistService: TodolistService) { 

    } 

    ionViewDidLoad() { 
    this.todolistService.statusToShow().subscribe(status => this.statusOfTheDay = status); 
    console.log('=== HOME ==='); 
    console.log(this.statusOfTheDay); 
    } 
} 

我不知道我的問題來自..這是正常的「== = HOME ===「首先出現在控制檯中？

預先感謝您的幫助，並感謝@ AJT_82。

Answer 1

我認爲這是因爲你沒有從你的.map返回任何東西。您也可以使用過濾器語句簡化它。

return this.afDB.list('/statut').map(status => { 
    return status.filter(s => this.dateOfTheDay === s.statut_date_tache && (s.statut_id_tache in this.statuts === false)); 
}); 

如果你仍然想註銷狀態，因爲它被選中，你可以使用

return this.afDB.list('/statut').map(status => { 
    return status.filter(s => { 
    if (this.dateOfTheDay === s.statut_date_tache && (s.statut_id_tache in this.statuts === false))) { 
     console.log (s); 
     return true; 
    } 
    return false; 
    } 
}); 

您還需要等待subscribe在登錄

ionViewDidLoad() { 
    this.todolistService.statusToShow().subscribe(status => { 
    this.statusOfTheDay = status; 
    console.log('=== HOME ==='); 
    console.log(this.statusOfTheDay); 
    }); 
}