大佬教程收集整理的这篇文章主要介绍了rest – 1：Angular2中两个对象的N或N：1关系作为http请求的可观察对象，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
假设我们将给所有现有英雄穿上特殊套件的可能性,但任何其他英雄也可以穿同一套房.我们真的不希望他们赤身裸体.在这种情况下,我们将有一个相关的数据对象,其中包含有关可用套装的所有信息.英雄本身必须知道他穿着哪个套房以及在哪里可以找到他所选择的套房.对于这种情况,我们将创建一个属性,其中包含所选服装的ID.
从http请求中可以观察到解决Angular中英雄和他的套件之间关系的正确方法是什么？
例如：
应用程序/ hero.ts
export class Hero {
id: number;
name: string;
suiteId: number;
}
应用程序/ suit.ts
export class Suite {
id: number;
name: string;
material: string;
color: string;
}
应用程序/内存-data.service.ts
import { InMemoryDbService } from 'angular-in-memory-web-api';
export class InMemoryDataService implements InMemoryDbService {
createDb() {
let heroes = [
{id: 11,name: 'Mr. Nice',suitId: 11},{id: 12,name: 'Narco',suitId: 12}
];
let suits= [
{id: 11,name: 'Nice and blue',material: 'Cotton',color: 'blue'},name: 'Sexy and red',material: 'Silk',color: 'red'}
];
return {heroes,suits};
}
}
我知道下一个代码块之类的东西会起作用,但我想知道如何解决这个“可观察”的方式.
// ...
getHeroesWithSuit(): Observable<Hero[]> {
return this.http.get(this.heroesUrl)
.map( response => response.json().data as Hero[])
.do( response => response.forEach( ( data ) => data.suite = this.suiteService
.getSuit(data.suiteId)
.subscribe(suite => data.suite = suite as Suite)
))
.catch(this.handleError);
}
// ...
由于我们想要结合这两个操作,我们需要使用flatMap和forkJoin运算符.使用这两个运算符的getHeroesWithSuit()函数可以用这样的Observable方式编写.
getHeroesWithSuit(): Observable<Hero[]> {
return this.http.get(this.heroesUrl)
.map(response => response.json().data as Hero[])
.flatMap((heroes: Heroes[]) => Observable.forkJoin(heroes.map((hero: Hero) => {
return this.suiteService.getSuit(hero.suiteId)
.map((suite: Suite) => {
hero.suite = suite;
return hero;
});
}))
);
}
flatMap Operator允许您链接两个Observable,返回一个新的Observable.这里我们将检索英雄服务的结果链接到forkJoined observable.
然后我们将每个英雄映射到suiteServices的getSuite()方法,并将结果传递给forkJoin运算符.
但是如果每个英雄都有多个套件并且Hero类的suiteId字段是一个数组.在这种情况下,我们必须再次使用forkJoin运算符来检索每个英雄的所有套件的信息.
在这个forkJoin中,我们将每个英雄的所有suiteId映射到suiteServices的getSuit()方法.这将是对象之间的1：N关系.更新getHeroesWithSuit()函数将如下所示.
getHeroesWithSuit():Observable<Hero[]> {
return this.http.get(this.heroesUrl)
.map(response => response.json().data as Hero[])
.flatMap(
(heroes:Heroes[]) => Observable.forkJoin(heroes.map(
(hero:Hero) => {
return Observable.forkJoin(hero.suiteIds.map(
suiteId => {
return this.suiteService.getSuit(suiteId)
}
)).map(
suites => {
hero.suites = suites;
return hero;
})
}
))
);
}
这里是reference link,它对运算符有很好的解释,以及如何使用它们来组合多个Observable.我希望这将有所帮助.
以上是大佬教程为你收集整理的rest – 1：Angular2中两个对象的N或N：1关系作为http请求的可观察对象全部内容，希望文章能够帮你解决rest – 1：Angular2中两个对象的N或N：1关系作为http请求的可观察对象所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。