Question

是否可以通过异步管道在可观察类上调用方法？

我已经尝试了以下方法，但我无法让它发挥作用。所以我想知道这是否可能或者可以更好地完成？

app.component.html

<p>Total Cost: {{ (orderState$ | async).TotalPrice() }}</p>

order.state.ts

export class OrderState {
    lineItems: OrderLineItem[];

    public TotalPrice(): number
    {
        // TODO: Calculate price of line items
        return 199;
    }
}

Answer 1

如果有必要，创建另一个observable。最好在subscribe内设置一个变量。

export class OrderState {
  lineItems: OrderLineItem[];
  get totalPrice(): number {
    // TODO: Calculate price of line items
    return 199;
  }
}

export class TheComponent {
  orderState$: Observable<OrderState>;
  // Here
  totalPrice$: Observable<string>;

  constructor() {
    // And then after you know what the orderState is.
    this.totalPrice$ = this.orderState$.map(state => state.totalPrice);
  }
}

<p>Total Cost: {{totalPrice$ | async}}</p>

Answer 2

也许这样的事情可以解决问题。基本上订阅构造函数中的流，当数据到达时计算价格。

此外，如果您要进行单元测试，这将比模板中的所有内容更容易。

<强> app.component.html

<p>Total Cost: {{ totalPrice }}</p>

<强> order.state.ts

export class OrderState {
  lineItems: OrderLineItem[];
  totalPrice: string = '';

  constructor() {
    orderState$.subscribe((value) => {
      this.totalPrice = this.CalculateTotalPrice(value);
    });
  }

  public CalculateTotalPrice(): number {
    // TODO: Calculate price of line items
    return 199;
  }
}

Answer 3

是的，这是可能的。以下是编译器生成的updateRenderer function的外观：

function(_ck,_v) {
    ...
    var currVal_1 = jit_unwrapValue_7(_v,7,0,jit_nodeValue_8(_v,8).transform(_co.orderState$)).TotalPrice();
    _ck(_v,7,0,currVal_1);
  });

让我们看看它的评价结果。首先是这部分：

jit_nodeValue_8(_v,8).transform(_co.orderState$)

transform方法订阅orderState$ observable并返回OrderState的实例。然后这部分：

jit_unwrapValue_7(...)

unwrapValue函数也返回实例：

export function unwrapValue(view: ViewData, nodeIdx: number, bindingIdx: number, value: any): any {
  if (value instanceof WrappedValue) {
      ....
  }
  return value;
}

所以评估整个表达式的结果是：

jit_unwrapValue_7(_v,7,0,jit_nodeValue_8(_v,8).transform(_co.orderState$))

是OrderState的实例，因此您可以调用其中的任何方法：

jit_unwrapValue_7(...).TotalPrice();

可以从异步管道调用类方法吗？

3 个答案: