Angular无限滚动+ deckgrid ng-只在新获取的数据上重复渲染卡

Angular infinite scroll + deckgrid ng-repeat render cards only on newly fetched data

本文关键字:数据 获取 deckgrid 滚动 无限 ng- 新获取 Angular      更新时间:2023-09-26

我将deckgrid与自定义的无限滚动轮结合使用,在Angular中加载连续的照片流,这些照片以砖石布局的形式呈现。每次返回的数据集非常大,我注意到deckgrid调用数据集上的quick-ng-repeat来生成卡片。Deckgrid还在数据集上放置了watchCollection,因此当数据集发生变化时(当用户滚动到底部时,通过向数据集添加数据来触发),ng-repeat将重新呈现数据集中的所有内容(旧数据和新数据一样)。

不幸的是,考虑到数据集的大小和我的应用程序必须做的其他后期处理,重新渲染每张卡是非常昂贵的。我希望能够离开已经渲染的卡片,因为是,只渲染新卡与新获取的数据。换句话说,ng-repeat是否有办法在已经渲染的元素上解除绑定?

我们必须在deckgrid指令中添加track by $index。这只会呈现新的DOM元素。

https://docs.angularjs.org/api/ng/directive/ngRepeat