Angular 将可观察的转化为承诺并操纵结果

我想计算从我的Firebase数据库返回的一组项目的总价格，作为一个可观察的项目。但是，该服务不返回任何内容

以下是我尝试过的：

服务：

  getRooms(): any {
    let result = {};
    this.items
      .toPromise()
      .then(items => {
        for (let item of items) {
          let name = item.name;
          let price = item.price;
          if (name in result) {
            result[name] += price;
          } else {
            result[name] = price;
          }
        }
      });
    return result;
  }

组件

export class InspirationComponent implements OnInit {

  rooms: any;

  constructor(private inspirationService: InspirationService) {
    this.items = this.inspirationService.getRooms();
  }

  ngOnInit() {
  }

}

export class InspirationComponent implements OnInit {

  rooms: any;

  constructor(private inspirationService: InspirationService) {
    this.inspirationService.getRooms().then(result => {
         this.items = result ;
    });
  }

---

首先，您不应该像那样填充变量

this.items

。 你应该这样做：

组件

export class InspirationComponent implements OnInit {

  rooms: any;

  constructor(private inspirationService: InspirationService) {
    this.items = this.inspirationService.getRooms();
  }

  ngOnInit() {
  }

}

export class InspirationComponent implements OnInit {

  rooms: any;

  constructor(private inspirationService: InspirationService) {
    this.inspirationService.getRooms().then(result => {
         this.items = result ;
    });
  }

服务

 getRooms(): any {
    return this.http.get('url')
      .map(items => {
         let result = {}
         for (let item of items) {
          let name = item.name;
          let price = item.price;
          if (name in result) {
            result[name] += price;
          } else {
            result[name] = price;
          }
        }
         return = result ;
    }).toPromise();
  }

---

我认为你必须解决你的承诺。组件中的更改

export class InspirationComponent implements OnInit {

 rooms: any;

  constructor(private inspirationService: InspirationService) {
    this.items = this.inspirationService.getRooms((result) => {console.log(result);});
  }
  ngOnInit() {
  }

}

---

为什么要这样做？在组件中操作数据打破了关注点的分离，并生成湿代码。但除了从REST调用的回调中填充组件变量外，并没有其他方法。另一种方法是将变量放入服务并在其中填充。这取决于如何使用

This.items

。如果它是在视图中绑定的，那么原始代码可能会工作（A1中$resource就是这样工作的）。getRooms可以只返回修改结果的承诺（目前它返回未定义的结果）。我不明白为什么整个

then

应该移动到component类中。@estus我同意，但是如果您将promise返回给this.items并在.then（）中返回result，this.items将不会有该数据，而是promise。受你们评论的影响，我修改了答案。是的，我相信它看起来更好。它应该是

返回这个.http.get（'url'）

。