我有一个Observable<FormGroup>,有几个布尔FormControl

readonly someForm$ = model$.pipe(map((model: Model) => {
  return new FormGroup({
    foo: new FormControl(model.getFoo()),
    bar: new FormControl(model.getBar()),
  });
}));

我想创建一个可观测的,如果FormControl个值中的任何一个是true,它就会emits .我try 了以下方法

readonly result$ = someForm$.pipe(switchMap(
  form => form.valueChanges.pipe(
    map(changes => changes.foo || changes.bar),
    startWith(() => form.value['foo'] || form.value['bar'])
  )
));

尽管在测试过程中result$总是分解为true.创造一个本质上是foo || bar的可观察事物的正确方法是什么?

最小示例:https://stackblitz.com/edit/angular-material-bvy7bj

推荐答案

有几个问题:

  • 组件中有result$个,模板中有$result个.

  • startWith()不接受函数,它需要是用例中的一个值.

  • 您对someForm$进行了两次订阅,这将创建两个不相关的FormGroup实例.你需要在someForm$的末尾使用shareReplay(1).

你的最新演示:https://stackblitz.com/edit/angular-material-xpqmcs?file=app%2Fapp.component.ts

Typescript相关问答推荐

Angular -使用Phone Directive将值粘贴到控件以格式化值时验证器不工作

为什么在TypScript中写入typeof someArray[number]有效?

界面中这种类型的界面界面中的多态性

在Angular中,如何在文件上传后清除文件上传文本框

React typescribe Jest调用函数

如何使用一个字段输入对象,其中每个键只能是数组中对象的id属性,而数组是另一个字段?

如何在typescript中设置对象分配时的键类型和值类型

TypeScrip:逐个 case Select 退出noUncheck kedIndexedAccess

在实现自定义主题后,Angular 不会更新视图

一个打字类型可以实现一个接口吗?

如何在typescript中为this关键字设置上下文

正交摄影机正在将渲染的场景切成两半

下载量怎么会超过下载量?

无法将从服务器接收的JSON对象转换为所需的类型,因此可以分析数据

如何在Reaction 18、Reaction-Rout6中的导航栏中获取路由参数

扩展对象的此内容(&Q;)

如何通过转换器类继承使用多态将对象从一种类型转换为另一种类型

如何将 MUI 主题对象的自定义属性与情感样式组件中的自定义props 一起使用?

覆盖高阶组件中的 prop 时的泛型推理

在 next.js 13.4 中为react-email-editor使用forwardRef和next/dynamic的正确方法