异步 – Angular2：数组索引的异步管道

发布时间：2020-12-17 17:16:58 所属栏目：安全来源：网络整理

导读：我有一个可观察的字符串数组const obs $：Observable string []在我的组件上作为属性.虽然我可以在* ngIf语句上成功使用异步管道,但是当通过数组索引器(obs $| async)[0]访问时管道会失败. 例： !-- evaluates the array emmitted by obs$for truthyness --d

我有一个可观察的字符串数组const obs $：Observable< string []>在我的组件上作为属性.虽然我可以在* ngIf语句上成功使用异步管道,但是当通过数组索引器(obs $| async)[0]访问时管道会失败.

例：

<!-- evaluates the array emmitted by obs$for truthyness -->
<div *ngIf="obs$| async">
    <!-- only shown if obs$emitted an array with length > 0 -->

    <!-- but this fails with error: Cannot read property '0' of null -->
    <img [src]="(obs$| async)[0]">
</div>

obs $的实例在组件的构造函数中设置,因此当模板受数据绑定时,不应该定义obs $.

如何正确访问模板中的数组元素？

解决方法

这可能会奏效

<img [src]="(obs$| async) ? (obs$| async)[0] : null">

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!