如果 ListView 中没有项目,如何显示按钮?
How to show a button if there are no items in a ListView?
我有以下结构:
<ScrollView tkMainContent>
<ListView [items]="students$ | async" class="list-group" *ngIf="students$">
<ng-template let-student="item">
<StackLayout>Student details go here</StackLayout>
当我的列表中没有学生时,我无法在 ScrollView
中显示按钮。
我怎样才能继续显示按钮?
注意:我正在真实的 iOS 设备上进行测试。
<FlexboxLayout flexDirection="column">
<GridLayout class="page-content" id="placeholderLayout" visibility="{{ hasContent ? 'collapse' : 'visible' }}">
<Label class="page-icon fa" text=""></Label>
<Label class="page-placeholder" style="white-space: normal" text="Click the camera button to add image"></Label>
</GridLayout>
<ScrollView>
<-- List View Here -->
</ScrollView>
</FlexboxLayout>
我在 NS Core 上使用类似的东西来显示占位符内容。 angular 中设置可见性的方式可能有所不同,但类似的标记应该适合您。
在component.ts中,您应该注意评估是否有内容要在列表视图中显示,如果有,则将 hasContent 设置为 true,否则设置为 false。
希望对您有所帮助 :) 如果您在实施过程中遇到任何问题,请告诉我。
我有以下结构:
<ScrollView tkMainContent>
<ListView [items]="students$ | async" class="list-group" *ngIf="students$">
<ng-template let-student="item">
<StackLayout>Student details go here</StackLayout>
当我的列表中没有学生时,我无法在 ScrollView
中显示按钮。
我怎样才能继续显示按钮?
注意:我正在真实的 iOS 设备上进行测试。
<FlexboxLayout flexDirection="column">
<GridLayout class="page-content" id="placeholderLayout" visibility="{{ hasContent ? 'collapse' : 'visible' }}">
<Label class="page-icon fa" text=""></Label>
<Label class="page-placeholder" style="white-space: normal" text="Click the camera button to add image"></Label>
</GridLayout>
<ScrollView>
<-- List View Here -->
</ScrollView>
</FlexboxLayout>
我在 NS Core 上使用类似的东西来显示占位符内容。 angular 中设置可见性的方式可能有所不同,但类似的标记应该适合您。
在component.ts中,您应该注意评估是否有内容要在列表视图中显示,如果有,则将 hasContent 设置为 true,否则设置为 false。
希望对您有所帮助 :) 如果您在实施过程中遇到任何问题,请告诉我。