连接扁平化数据 [英] Joining Flattened Data
问题描述
我想将我的客户表中的 init 数据加入到项目列表中.
i'd like to join the data on init from my customers table into the projects list.
模型是这样的:
项目
- 键
- 名称:字符串
- 客户:customerKey
客户
- 键
- 名称:字符串
你有一个例子,我如何使用 angularfire2 从 angular2 组件中做到这一点?
Do you have an example, how i do this from angular2 component using angularfire2?
我的控制器如下所示:
import { Component, OnInit } from '@angular/core';
import { Project } from '../project';
import { Router } from '@angular/router';
import { FirebaseAuth } from 'angularfire2';
import { AngularFire, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2';
import { Observable } from 'rxjs';
@Component({
moduleId: module.id,
selector: 'app-projects',
templateUrl: 'projects.component.html',
styleUrls: ['projects.component.css']
})
export class ProjectsComponent implements OnInit {
projects: FirebaseListObservable<any[]>;
customers: FirebaseListObservable<any[]>;
projectName: string;
constructor(
private router: Router,
private af: AngularFire
) { };
ngOnInit() {
this.projects = this.af.database.list('projects');
}
add(projectName: string) {
this.af.database.list('projects')
.push({ name: projectName, id: '123' });
this.projectName = null;
}
}
更新
我已将 this.projects 的类型从 FirebaseListObservable 更改为 Observable我的 ngOnInit() 方法现在看起来像这样:
i've changed the type of this.projects to Observable from FirebaseListObservable my on ngOnInit() method looks now like this:
ngOnInit() {
this.projects = this.af.database.list(`projects`)
.map(projects => {
projects.map(project => {
this.af.database.object('customer/' + project.customer + '/name')
.subscribe(customer => {
project.customer = customer;
})
return project;
})
return projects;
});
}
我现在不能从里面的模板访问客户的名称属性
i can now access not the name property of customer from the template inside of
<li *ngFor="let project of projects | async">
project.customer.$value
推荐答案
不太确定你的数据集是什么样子,所以我只写一个基本的例子.假设一个结构是这样的:
Not exactly sure how your dataset looks like, so I'm just going to write a basic example. Assuming a structure something like this:
- projects
- key
- name: string
- customers
- customerKey: boolean
- customers
- key
- name: string
示例数据
- projects
- projectId1
- name: "Cool project!",
- customers
- customerId1: true,
- customerId2: true
- projectId2
- name: "Another cool project!",
- customers
- customerId2: true,
- customerId3: true
- customers
- customerId1
- name: "John Smith"
- customerId2
- name: "John Doe"
- customerId3
- name: "John John"
因此,我们将客户的密钥存储在每个项目的 customers
属性中.
So we're storing the customers' key in every projects' customers
property.
假设我们想列出每个项目,但我们还想获得客户的真实姓名,而不仅仅是他们的 ID.由于 firebase 没有连接,我们必须手动执行此操作.这是一种方法:
Let's say we want to list every projects, but we also want to get the customers' real name as well, not just their id. Since firebase doesn't have joins we'll have to do this manually. Here's one way to do it:
this.projects = this.af.database.list(`projects`)
.map(projects => {
return projects.map(project => {
project.customers.map(customer => {
this.af.database.list(`customers`)
.subscribe(c => {
customer = c;
});
});
return project;
});
});
如果您想异步获取数据,可以将内部 .subscribe
更改为简单的 .map
(在这种情况下使用 async
> 模板中的管道`).
The inner .subscribe
could be changed to a simple .map
if you want to get the data asynchronously (in this case use the async
pipe in the template`).
这篇关于连接扁平化数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!