【问题标题】:angular using an observable within an observable在可观察对象中使用可观察对象的角度
【发布时间】:2018-08-13 09:50:16
【问题描述】:

我正在使用 Angular 6 制作费用管理器 webapp。我的数据库在 firebase 上。我正在使用 angularfire2 库来检索和更新数据。

数据库设计如下

获取类别的函数是

getCategory(uid:String,categorykey:string):Observable<any> 
   {

return this.afdb.object(`users/${uid}/categories/${categorykey}`)
  .snapshotChanges()
  .pipe(map(c=>({key:c.payload.key,...c.payload.val()})));}

返回带有费用数组的可观察对象的函数是

getExpensesWithKeys(uid:String):Observable<any>{
return this.afdb.list(users/${uid}/expenses)
.snapshotChanges()
.pipe(
  map(changes =>
  changes.map(c => 
({key:c.payload.key,...c.payload.val()}))
  )
);
 }

在我的组件中,我可以得到我的费用

expenses:Expense[];
getExpensesWithKey("userid-123")
.subscribe(expenses=>this.expenses=expenses)

以及任何类别

category:Category;
getCategory("userid-123",expenses[0].category)
.subscribe(category=>this.category=category);

我想创建一个 observable,它获取费用数组并返回每个费用的类别,我可以将其推送到类别数组中。 我一直在绞尽脑汁将这两个 observables 与各种 rxjs 操作符结合起来,但无济于事。

非常感谢您的帮助。

编辑: 只是想添加一些我已经尝试过的方法。 我尝试过的一种方法是

this.getExpensesWithKeys("user-123")
.pipe(mergeMap(expenses=>
expenses.map(expense=>
this.getCategory("user-123",expense.category)))).subscribe(console.log);

但它只是发出一个 Observables 数组。如何获取类别对象并将它们推送到数组中?

我尝试的另一种方法

this.rtdbService.getExpensesWithKeys("user-123")
.pipe(map(expenses=>
   expenses.map(expense=>expense.category)))
   .pipe(mergeMap(ids=>
this.rtdbService.getCategory("user-123",ids)))
.subscribe(console.log);

这只是发出类别的键。

我也尝试了下面提供的答案,它没有发出任何东西。

提前致谢

【问题讨论】:

    标签: angular rxjs angularfire2


    【解决方案1】:

    我终于找到了解决办法

      getExpensewithCategories(uid:String):Observable<any>{
        ;
        let expwithCat$=this.getExpenses(uid).pipe(mergeMap(expenses =>{
          return expenses.map(expense => this.getCategory(uid,expense.category)
          .pipe(map(cat=>
            ({expensekey:expense.key,
              amount:expense.amount,
              date:expense.date,
              expcatkey:expense.category,
              categorykey:cat.key,
              color:cat.color,
              name:cat.name})
            )
          ))
       }
        }));
    
          return expwithCat$.pipe(mergeAll())
    }
    

    【讨论】:

      【解决方案2】:

      mergeMapforkJoin 组合成链式可观察对象以同时进行多个调用:

      getBothCategoryAndExpenses(uid) {
        return this.getExpensesWithKeys(uid).pipe(
          mergeMap(expenses => forkJoin(expenses.map(expense => this.getCategory(uid, expense.key)))
          )
        );
      }
      

      【讨论】:

      • 当我订阅这个 observable 时,它​​没有返回任何东西。我对您创建的方法进行了细微更改。 getBothCategoryAndExpenses(uid):Observable { return this.getExpensesWithKeys(uid).pipe( mergeMap(expenses => forkJoin(expenses.map(expense => this.getCategory(uid,expense.category))) //expense。类别持有该费用类别的键)); }
      猜你喜欢
      • 1970-01-01
      • 2019-09-09
      • 1970-01-01
      • 1970-01-01
      • 2019-01-30
      • 1970-01-01
      • 1970-01-01
      • 2011-06-17
      • 1970-01-01
      相关资源
      最近更新 更多