在模板中,如何绑定到由可观察对象传递的对象的深度嵌套 属性?

In a template, how do I bind to a deeply nested property of an object delivered by an observable?

我有一个对象,它是通过一个名为 compModel 的可观察对象获得的。它给了我一个大的配置对象,我需要用它来调整 dom 的片段。我想做的一件事是根据这个模型使一些复选框成为 checked/unchecked,但我无法访问它们各自的属性。

  1. 将 compModel observable 评估为 truthy 并在收到数据时选中复选框

<input type="checkbox" checked="{{compModel | async}}">

  1. 当 obj 在 compModel 上定义时 最终 其计算结果为 null 并且该框在任何时候都不会被选中。我认为这被解释为将 observable 的 obj 属性 传递给异步管道,其中 returns null 因为 observable 本身没有 obj,未来的数据

<input type="checkbox" checked="{{compModel.obj | async}}">

  1. 我收到一条错误消息说 angular Cannot read property boolean of undefined。这里的布尔值是我所追求的。我如何获得它?

<input type="checkbox" checked="{{compModel.obj.boolean | async}}">

<input type="checkbox" checked="{{(compModel | async)?.obj?.boolean}}">

您需要使用异步管道传输实际可观察​​对象,然后使用 elvis 运算符有条件地访问它的未来属性,以处理它们尚不可用的情况。