如何在过滤后的 Observable 上设置值

Question

我正在使用 Angular 9。我得到一个过滤的对象列表。我想更改返回对象的值。

我有以下代码：

  private setFilteredApproverOptions(): void {
    for (const field in this.approvalEditFormGroup.controls) {
      console.log(field);
      this.approvalEditFormGroup.get(field).valueChanges.subscribe(value => {
        if (value && typeof value.valueOf() === "string") {
          this.filteredApproverOptions = this._filter(value);
          this.filteredApproverOptions.forEach(person => {console.log(person)});
        }
      });
    }
  }

  private _filter(value: string): Observable<Person[]> {
    const filterValue: string = value.toLowerCase();
    let respApprovalState: Observable<Person[]> = this.getApproverOptions(filterValue);
    respApprovalState.subscribe(approverOptions => {
      return approverOptions.filter(option => (option.firstName.toLowerCase().includes(filterValue) || option.lastName.toLowerCase().includes(filterValue)));
    });
    return respApprovalState;
  }

  private getApproverOptions(searchString: string): Observable<Person[]> {
    let companyName: string = this.approvalEdit.companyName;
    let respApprovalState: Observable<Person[]> = this.service.getApprovers(companyName, searchString);

    respApprovalState.subscribe((approverOptions: Person[]) => {
      this.approverOptions = approverOptions as Person[];
      return approverOptions;
    },
    error => {
      console.log('Error calling getApprovers service', error);
      return null;
    });

    return respApprovalState;
  }

下面一行：

this.filteredApproverOptions.forEach(person => {console.log(person)});

有这个输出：

我想将x 和y 值设置为硬编码值（例如1）。

例如

x: 1, y: 1, personId: 105702...

问题

如何设置上述x 和y 值？

更多信息：

export class Person {
    public constructor(init?: Partial<Person>) {
      Object.assign(this, init);
    }
    x: number;
    y: number;
    personId: number;
    firstName: string;
    lastName: string;
    email: string;
    companyName: string;
    staffCode: string;
  }

Answer 1

您只需要映射您的可观察对象，然后映射您的数组。映射可观察对象的工作方式几乎与使用数组相同。给你：

const mapped = this.filteredApproverOptions.pipe(map(    // obs.pipe(map(...)) is changing each value coming in an observable/subject
    pArr => pArr.map(p => ({...p, x: 1, y: 1}))          // arr.map(...) is changing each value in an array
));

现在你可以订阅它或任何你想用它做的事情，像这样：

mapped.subscribe(val => console.log(val));

参考：

• 映射数组
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
• 映射一个 observable
  • https://www.learnrxjs.io/learn-rxjs/operators/transformation/map
  • What does the `map` method mean in RxJS?