javascript - 如何在创建 Observer 时强制评估 Observer 中的表达式，而不是在发出值时

Question

我在此链接上发布了一个类似的问题:enter link description here但没有收到任何答案(我以为我有答案，但现在我不太确定)并且仍然很困惑，所以我非常感谢一些反馈和指导。

我有一个响应式表单，其中出现以下订阅中的函数在可观察对象发出数据(并调用订阅函数)时评估 itm["value"].length-1 .

  this.formCtls[controlName] = new FormControl('', {updateOn: 'blur'});
  this.userForm.addControl(controlName, this.formCtls[controlName]);
  this.formCtls[controlName].valueChanges.subscribe(val=>{
    itm["value"][itm["value"].length-1]=val;
    this.renderDataArray();
  });

但是，我希望订阅回调函数表达式 itm["value"].length-1 在 created observable/(FormControl) 时被评估.

例如，在创建表单控件时，itm["value"].length 可能只有 2，但在 Observable 发出数据时，itm["value"].length 可以是 6 或 7 或任何其他数字。我如何(以编程方式)确保“2”(或其等效值)的值进入订阅回调，而不是“6”或“7”，或者 Observable 发出时可能是什么值？

我想到了两种方法，但不确定是否有效:

1. 先声明const itmLength = itm["value"].length，然后构造回调，即:

const itmLength = itm["value"].length;
this.formCtls[controlName] = new FormControl('', {updateOn: 'blur'});
      this.userForm.addControl(controlName, this.formCtls[controlName]);
      this.formCtls[controlName].valueChanges.subscribe(val=>{
        itm["value"][itmLength-1]=val;
        this.renderDataArray();
      });

但我不确定 itmLength 是否包含实际值(在这种情况下，上述方法会起作用)，或者更确切地说是指向 itm["value"].length(在这种情况下，上述方法将不起作用)。我认为这种方法工作正常，但后来我更改了代码并遇到了“ block 作用域变量”的问题，解决该问题的唯一方法是在内部循环之外声明常量/变量，然后在这样做之后代码不再给我预期的“2”，而是继续给我不想要的“6”或“7”。所以总的来说，第一种方法有效吗？ (或者 const itmLength 只是一个指针，在这种情况下 itm["value"].length 只会在 Observable 发出时被评估)？

第二种方法是在可观察对象中添加一个管道，例如:

this.formCtls[controlName].valueChanges.pipe(
        switchMap(v=>Object.assign({},{value: v}, {length: itm["value"].length}))
        .subscribe(val=>{
        itm["value"][val.length-1]=val.value;
        this.renderDataArray();
      });

我不确定第二种方法是否有任何好处，或者 itm["value"].length 是否仅在 valueChanges Observable 发出时才被评估，而不是在创建 formControl 回调时。

如果有人有任何解决方案或可以对我的这个问题提供一些见解，请提前致谢。

=====

这是基于@Fan Cheung 的优秀解决方案的最终答案(考虑到 resultsSelector 的弃用):

of(itm["value"].length).
   pipe(switchMap(length=>this.formCtls[ctlName].valueChanges.
      pipe(map(newVal => [newVal,length]))
      )).
   subscribe(([newVal,length])=> . . .

Answer 1

您可以将 itm["value"].length 组合成整数而不是指针的流，因此它在创建时是固定的。 of 运算符只会发出一次，然后切换到 valueChanges 流

of(itm["value"].length)
.pipe(switchmap(length=>this.formCtls[controlName].valueChanges,
// result seletor
value=>[length,value]))
.subscribe(([length,value])=>{
       ....... do you stuff
      });