可观察-使用地图添加数据？

Question

我有这个代码

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container">
  <div class="row">
    <div class="col-sm-12">

      <ul class="software">
        <li>
          <span class="title">Software 1</span>
          <span class="column-align">
            <a class="btn btn-primary" href="https://example.com/download.exe">Download</a>
            <a class="btn btn-primary" href="https://example.com/download.exe">Download demo</a>
          </span>
        </li>
        <li>
          <span class="title">Software 2</span>
          <span class="column-align">
            <a class="btn btn-primary" href="https://example.com/download.exe">Download</a>
          </span>
        </li>
        <li>
          <span class="title">Software 4 (Special Edition)</span>
          <span class="column-align">
            <a class="btn btn-primary" href="https://example.com/download.exe">Download</a>
            <a class="btn btn-primary" href="https://example.com/download.exe">Download demo</a>
          </span>
        </li>
        <li>
          <span class="title">Software 5</span>
          <span class="column-align">
            <a class="btn btn-primary" href="https://example.com/download.exe">Download</a>
          </span>
        </li>
      </ul>

    </div>
  </div>
</div>

this.store .select(s => s.pins) .pipe(filter(s => !s.loading)) .subscribe(pinsState => { this.listItems = pinsState.pins; }); 是一个对象数组。

我想在获取数据时重新计算数组中每个对象的值。例如：

pins

如何使用pins.calculatedval = calcnewval() 运算符执行此操作？还是我应该使用另一个运算符？

Answer 1

您可以使用tap()来更改引脚。您无需返回任何内容，流将继续包含this.store中的pinState。

this.store
    .pipe(
         filter(s => !s.loading),
         tap(s => s.pins.forEach(pin => pin.calculatedVal = calcnewval()))
     )
     .subscribe(x => this.listItems = x.pins);

在您的原始示例中，您还使用select()，但我相信它已被map()取代，并且由于过滤器使用了您所映射对象的父对象的属性，因此也会导致错误