ListView scroll is working fine when only one ListView is there. If i create a nested ListView and try to scroll only parent ListView is scrolling. Please help me out to resolve this issue.
<ListView [items]="items">
<ng-template let-item="item">
<GridLayout class="list-view" rows="auto, *">
<StackLayout row="0" class="list-view__content" (tap)="toggleAccordion(item)">
<GridLayout columns="*, auto">
<FlexboxLayout col="0" alignItems="center">
<Label class="list-view__content__headline" [class.has-selected]="item.count > 0" textWrap="true" [text]="item.title"></Label>
<Label class="list-view__content__count" textWrap="true" *ngIf="item.count > 0" [text]="item.count"></Label>
</FlexboxLayout>
<StackLayout col="1">
<Image *ngIf="item.opened" src="font://" class="fas" width="15"></Image>
<Image *ngIf="!item.opened" src="font://" class="fas" width="15"></Image>
</StackLayout>
</GridLayout>
</StackLayout>
<StackLayout row="1" *ngIf="item.values && item.values.length > 0 && item.opened">
<ns-multi-select-search [data]="item (selectionChange)="onSelectionChange($event)"></ns-multi-select-search>
</StackLayout>
</GridLayout>
</ng-template>
</ListView>
ns-multi-select-search component having nested ListView
<GridLayout rows="auto, 140" class="select">
<StackLayout row="0">
<SearchBar hint="Search here ..." (textChange)="onTextChanged($event)" (clear)="onClear($event)" (loaded)="onSearchBarLoaded($event)"></SearchBar>
</StackLayout>
<StackLayout row="1" class="select__content" *ngIf="(allItems && allItems.length > 0)">
<ListView [items]="allItems">
<ng-template let-item="item">
<GridLayout columns="*, auto" (tap)="toggleSelected(item)" class="select__content__list">
<StackLayout col="0">
<Label class="select__content__list__label" [text]="item.name" textWrap="true"></Label>
</StackLayout>
<StackLayout col="1">
<Image *ngIf="item.checked" src="~/assets/images/checked-check-box.png" width="20" class="m-t-5"></Image>
<Image *ngIf="!item.checked" src="~/assets/images/default-check-box.png" width="20" class="m-t-5"></Image>
</StackLayout>
</GridLayout>
</ng-template>
</ListView>
</StackLayout>
<FlexboxLayout row="1" *ngIf="(allItems && allItems.length === 0)" flexDirection="column" alignItems="center" justifyContent="center" class="select__content flex-error">
<Label class="message" text="No match found!"></Label>
</FlexboxLayout>
</GridLayout>
from How to enable scolling on nested ListView in Nativescript?
No comments:
Post a Comment