angular - RxJS 6+ 类型 'Observable' 必须有一个返回迭代器的 'Symbol.iterator' 方法

Question

尝试从可观察对象中获取经过过滤的值数组时出现以下错误:

Type 'Observable' must have a 'Symbol.iterator' method that returns an iterator.

代码:

export class ItemsService {

  orderItems: OrderItem[] = [];
  orderItemsUrl = 'http://localhost:5000/order-items/';

  getOrderItemsFromHttp(selectedOrderNumber): Observable<OrderItem[]> {
    const tempArr = [];
      const orderItems = of (this.http.get<OrderItem[]>(`${this.orderItemsUrl}`)
      .subscribe(res => {
            this.orderItems = res;
      }) );

    for (const orderItem of orderItems) {                        <--- Error here
        if (orderItem.orderNumber === selectedOrderNumber) {
          tempArr.push(orderItem);
        }
    }
    return of(tempArr);
  }  
}

如果我修改以下内容

for (const orderItem of orderItems) {

到

for (const orderItem of [orderItems]) {

错误消失了，但是属性 orderNumber 不再被重新识别，并且 intellisens 说:

Property 'orderNumber' does not exist on type 'Subscription'

请问我该如何解决？

Answer 1

在我看来你正在寻找这个:

  getOrderItemsFromHttp(selectedOrderNumber): Observable<OrderItem[]> {
    return this.http.get<OrderItem[]>(`${this.orderItemsUrl}`).pipe(
      map(orderItems => orderItems.filter(oi => oi.orderNuber === selectedOrderNumber))
    );
  }  

为此，您需要导入 map 运算符:

import { map } from 'rxjs/operators';