使用 AsyncPipe 获取可观察<记录<字符串、布尔值>>的值

Question

我有一个服务，它将登录用户的权限作为记录返回。所需的可观测值在我的ts文件中定义为成员变量：

permissionsRecord$: Observable<Record<string, boolean>>;

当调用服务时，我会传递一个要检查的授权数组。在这个例子中，我只检查权限"updateInterval"：

constructor() {
this.permissionsRecord$ = this.japs.userHasPermissionForActions([root.scheduler.order.updateInterval]);
}

从服务返回的记录具有要检查的授权作为密钥。该值显然可以是真或假。我现在想从我的模板文件中访问记录，如下所示：

<app-scheduler [allowDragAndDrop]="(permissionsRecord$ | async)[root.scheduler.order.updateInterval]">

事实上，它工作得很好，但我在控制台中看到一个错误。

SchedulerComponent.html:4 ERROR TypeError: Cannot read property 'scheduler.order.updateInterval' of null
at Object.eval [as updateDirectives] (SchedulerComponent.html:13)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:45258)
at checkAndUpdateView (core.js:44270)
at callViewAction (core.js:44636)
at execComponentViewsAction (core.js:44564)
at checkAndUpdateView (core.js:44277)
at callViewAction (core.js:44636)
at execEmbeddedViewsAction (core.js:44593)
at checkAndUpdateView (core.js:44271)
at callViewAction (core.js:44636)

我不确定我的代码是否正确。如何从模板中使用async正确访问可观察对象"内部"的记录？

Answer 1

如果输出良好，可以尝试使用安全/elvis运算符?，如下所示：

<app-scheduler [allowDragAndDrop]="(permissionsRecord$ | async).root?.scheduler.order.updateInterval">

Answer 2

尝试

<app-scheduler [allowDragAndDrop]="(permissionsRecord$ | async)?.root.scheduler.order.updateInterval">