2017-01-20 9 views
3

私は検索しても、正しい答えを得ることができませんでした。あなたが私に正しい方向を向けることを嬉しく思うでしょう。anglefire2データベースの結合を行う方法

私はユーザーとデータベースを持っているし、今、私は私のプロジェクトを表示したい

pojects: 
    08177a0acb3f4d96f8cb5fa19002d2ed: 
     pid: 08177a0acb3f4d96f8cb5fa19002d2ed, 
     pName: "Prject 1" 
     uId: "254", 
     createdAt: 9377476 



users: 
    254: 
     userName: "Eric" 
     uId: "254" 
     avatar: "image.jpg" 

、私は私のサービス

this.projectList = this.af.database.list('projects', { 
     query: { 
     orderByChild: 'createdAt' 
     } 
    }); 



getProjects() { 
    return this.projectList.map(snapshot => { 
     return snapshot; 
    }); 

にリストを取得しないと私はcomponent.tsで購読突き出

this.projectService.getProjects() 
    .subscribe(projects => this.projects = projects); 

私がしたいことは、userNameをユーザーから取得してプロジェクトで表示することです。

プロジェクトでuIdフィールドを使用して、ユーザーリスト内のユーザー情報を1つのリストに取得して表示させるにはどうすればよいですか?つまり{{project.userName}} {{project.avatar}}

import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/observable/forkJoin'; 
import 'rxjs/add/operator/first'; 
import 'rxjs/add/operator/switchMap'; 

// Compose an observable based on the projectList: 

this.projectWithUserList = this.projectList 

    // Each time the projectList emits, switch to unsubscribe/ignore 
    // any pending user queries: 

    .switchMap(projects => { 

    // Map the projects to the array of observables that are to be 
    // joined. 

    let userObservables = projects.map(project => this.af.database 
     .object(`users/${project.uId}`) 
     .first() 
    ); 

    // Join the user observables, and match up the users with the 
    // projects, etc. 

    return userObservables.length === 0 ? 
     Observable.of(projects) : 
     Observable.forkJoin(...userObservables, (...users) => { 
     projects.forEach((project, index) => { 
      project.userName = users[index].userName; 
      project.avatar = users[index].avatar; 
     }); 
     return projects;   
     }) 
    }); 

上記の実装はプロジェクトの配列を放出する:あなたはプロジェクトのためにユーザーを取得するためにforkJoinを使用することができ、放出されたプロジェクトのオブジェクトに必要なプロパティをコピーするために、その結​​果セレクタを使用することができ

+0

AngularFire(2)SQLベースではないので、あなたができます「結合」を実行しません。あなたがする必要があるのは、 'equalTo'演算子を使って2番目のテーブルをクエリして2番目のリストをフィルタリングし、最初のテーブルの値と一致するレコードだけにすることです。 – Claies

答えて

8

データベース内のプロジェクトが変更されるたびに変更されますが、ユーザー情報が変更された場合は配列を出力しません。

あなたは、プロジェクトやユーザ情報の変更のいずれか場合は、配列を放出したい場合は、ユーザーのためcombineLatestの代わりforkJoinを使用することができます。

import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/observable/combineLatest'; 
import 'rxjs/add/operator/switchMap'; 

// Compose an observable based on the projectList: 

this.projectWithUserList = this.projectList 

    // Each time the projectList emits, switch to unsubscribe/ignore 
    // any pending user queries: 

    .switchMap(projects => { 

    // Map the projects to the array of observables that are to be 
    // combined. 

    let userObservables = projects.map(project => this.af.database 
     .object(`users/${project.uId}`) 
    ); 

    // Combine the user observables, and match up the users with the 
    // projects, etc. 

    return userObservables.length === 0 ? 
     Observable.of(projects) : 
     Observable.combineLatest(...userObservables, (...users) => { 
     projects.forEach((project, index) => { 
      project.userName = users[index].userName; 
      project.avatar = users[index].avatar; 
     }); 
     return projects;   
     }); 
    }); 
+0

うまく動作します。ありがとうございました! –

関連する問題