Nativescript listview禁用重用

Question

我有ListView个自定义组件，它们接收一个布尔@Input()属性，负责显示模板的某些部分。

这是ListView：

<ListView [items]="photos">
    <ng-template let-item="item">
        <app-post [photo]="item" [displayInfo]="display"></app-post>
    </ng-template>
</ListView>

display变量设置为false。

这是app-post模板：

<StackLayout *ngIf="displayInfo" verticalAlignment="center">
....            
</StackLayout>

其中displayInfo是输入属性。 在app-post组件内部，我有将displayInfo值更改为true的逻辑。 但是我注意到ListView只创建了几个组件，而不是将它们重新用作向下滚动。 这会导致以下（示例）场景：

1. 5 app-post个组件的列表，所有组件都displayInfo为假
2. 点击第一个app-post组件集displayInfo为真
3. 3d和第5 app-post个组件已设置为displayInfo 真

如何避免此行为并将所有自定义组件的属性设置为listview中指定的值？

Answer 1

NativeScript ListView是虚拟化的，并且正在为其单元格使用回收，这会导致您的问题，因为您希望自定义组件最初在列表中创建，而实际上，它们是正在重用的列表单元格的一部分

解决方案是将displayInfo布尔值作为项目模型的一部分。 Here是针对TypeScript项目解释的类似解决方案，但基于Angular的项目可以使用相同的概念