将 AngularFIre 结果转换为自定义类型并使其可迭代
Transforming the result of an AngularFIre result to a custom type and have it be iterable
我有一个如下所示的服务方法:
getManufacturers(): Observable<Manufacturer> {
return this.db.list('/manufacturers')
.flatMap(mfg => { return mfg; })
.map(mfg => new Manufacturer(mfg));
}
我真正想要的 return 是 Observable<Manufacturer[]>
这样我就可以在我的模板中使用 | 对其进行迭代异步管道。
我是 Observables 和 Angular2+ 的新手,所以我确定我只是不明白如何将这些东西连接起来。我理解 flatMap 正在展开 angular fire 发回的数组(到单个元素中),这样我就可以 map/transform 每个元素成为特定的 class 类型。但是,然后我失去了它是一个正在 returned 的数组。所以这不再有效:
<div *ngFor="let listing of listings | async">
</div>
我是否应该将整个数组从传入的本机类型映射到我的自定义 classes 数组,而不是执行 flatMap?
是否有更好的方法来为 return 从 angular 调用中编辑的数据类型添加自定义功能?
在进一步考虑之后,我想我对将通用对象数组映射到新的制造商数组的疑惑开始变得有意义了(而不是将其分解为元素、转换并尝试重新组合)。
由于流上的传入值是一个数组,只需将它映射到一个新数组,该数组具有我想要的对象类型,这对我来说很有意义。
所以,我将我的服务方式调整为如下所示:
getManufacturers(): Observable<Manufacturer[]> {
return this.db.list('/manufacturers')
.map(mfgs => mfgs.map(mfg => new Manufacturer(mfg)));
}
我仍然很好奇是否有更好的方法(更具反应性)来处理这个问题。例如,一个更好的方法来处理数组到新类型的转换,以按照我最初的想法将数组分解并重新组装成一个新数组。
模板然后使用 <div *ngFor="let listing of listings"></div>
(其中 listings 是制造商数组(注意不再异步)。
我有一个如下所示的服务方法:
getManufacturers(): Observable<Manufacturer> {
return this.db.list('/manufacturers')
.flatMap(mfg => { return mfg; })
.map(mfg => new Manufacturer(mfg));
}
我真正想要的 return 是 Observable<Manufacturer[]>
这样我就可以在我的模板中使用 | 对其进行迭代异步管道。
我是 Observables 和 Angular2+ 的新手,所以我确定我只是不明白如何将这些东西连接起来。我理解 flatMap 正在展开 angular fire 发回的数组(到单个元素中),这样我就可以 map/transform 每个元素成为特定的 class 类型。但是,然后我失去了它是一个正在 returned 的数组。所以这不再有效:
<div *ngFor="let listing of listings | async">
</div>
我是否应该将整个数组从传入的本机类型映射到我的自定义 classes 数组,而不是执行 flatMap?
是否有更好的方法来为 return 从 angular 调用中编辑的数据类型添加自定义功能?
在进一步考虑之后,我想我对将通用对象数组映射到新的制造商数组的疑惑开始变得有意义了(而不是将其分解为元素、转换并尝试重新组合)。
由于流上的传入值是一个数组,只需将它映射到一个新数组,该数组具有我想要的对象类型,这对我来说很有意义。
所以,我将我的服务方式调整为如下所示:
getManufacturers(): Observable<Manufacturer[]> {
return this.db.list('/manufacturers')
.map(mfgs => mfgs.map(mfg => new Manufacturer(mfg)));
}
我仍然很好奇是否有更好的方法(更具反应性)来处理这个问题。例如,一个更好的方法来处理数组到新类型的转换,以按照我最初的想法将数组分解并重新组装成一个新数组。
模板然后使用 <div *ngFor="let listing of listings"></div>
(其中 listings 是制造商数组(注意不再异步)。