Question

我正在尝试创建一个不断更新新评论的实时评论Feed。我想限制评论区域的大小，并希望评论一旦达到最大值就从DOM中消失。达到了评论数量。

例如，最低评论是最新评论，而堆栈中的第一条评论不再完全可见：

<div class="liveComments" scroll="true" text-wrap>

  <ion-row class="liveComment" *ngFor="let cm of comments;" >

      <ion-col col-2 col-md-2><img src="https://website.com/uploads/user/avatar/49420/shades.jpg" class="liveProfile"/></ion-col>

      <ion-col col-3 col-md-3 class="usernameLiveComment"> {{username}}</ion-col>

      <ion-col col-7 col-md-7>  <span>{{cm.comment}} </span> </ion-col>

  </ion-row>

  <ion-row align="center">

      <ion-col col-12 col-md-12><img src="assets/imgs/spinner.gif" width="15%" align="center" /></ion-col>

  </ion-row>

</div>

Answer 1

使用注释数组和推送/切片/弹出条目。绑定为你完成了工作。

Offtopic：使用:enter和:leave

制作精彩动画

另外，您可以使用virtual-scroll列表，因此dom操作是通过离子魔法完成的

如何在Angular 2 / Ionic 2中调整实时注释div的大小

1 个答案: