使用ascyn时如何获取返回的observable array的length

当在Angular中使用async时,返回的是Observable,如果想要实现一个loading或者没有数据 的提示,我们需要知道返回数据的长度

可以使用 (users$ | async)?.length的方式:

<div class="table-body">
                <ng-container *ngIf="!isLoading && (users$ | async)?.length">
                    <ul>
                        <li *ngFor="let user of users" fxLayout="row" fxLayoutAlign="space-around center">
                            <span fxFlexOffset="-15" fxFlex="30">{{user.client_ip}}</span>
                            <span fxFlexOffset="-25">{{user.ip_province}}</span>
                            <span fxFlexOffset="-15">{{user.views}}</span>
                        </li>
                    </ul>
                </ng-container>
                <div *ngIf="!isLoading && (users$ | async)?.length === 0" class="f-cc">
                    暂无数据
                </div>
                <sim-spinner [loading]="isLoading"></sim-spinner>
            </div>

参考:

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,180评论 19 139
  • afinalAfinal是一个android的ioc,orm框架 https://github.com/yangf...
    passiontim阅读 15,616评论 2 45
  • 背景 一年多以前我在知乎上答了有关LeetCode的问题, 分享了一些自己做题目的经验。 张土汪:刷leetcod...
    土汪阅读 12,790评论 0 33
  • 首页 资讯 文章 资源 小组 相亲 登录 注册 首页 最新文章 IT 职场 前端 后端 移动端 数据库 运维 其他...
    Helen_Cat阅读 3,957评论 1 10
  • 这两天一直在看《刻意练习》这本书,学到一点就是,天才或许并不是天生的,天赋可能可以通过练习达成。所以,我准备尝试写...
    卤兔子阅读 180评论 0 0