CODEWITHSUNDEEP
nativescriptangular2-nativescript
vivekanon
vivekanon

Reputation: 1823

Nativescript : Error: More than one view found in list template! Nesting level: 0

The layout inside template solution doesn't work

list.html

<ActionBar title="View Team Members">
    <NavigationButton text="Back" android.systemIcon="ic_menu_back"></NavigationButton>
</ActionBar>
<GridLayout>
    <ListView [items]="teamList" class="small-spacing">
        <template let-item="item">
            <StackLayout>
              <Label [text]="item.name" class="medium-spacing"></Label>
              <Label [text]="item.email" class="medium-spacing"></Label>
            </StackLayout>
        </template>
    </ListView>
</GridLayout>

Same error trace : 

com.tns.NativeScriptException: 
Calling js method getView failed

Error: More than one view found in list template! Nesting level: 0
File: "/data/data/org.nativescript.finlyng/files/app/tns_modules/nativescript-angular/directives/list-view-comp.js,

line: 138, column: 8

StackTrace: 
  Frame: function:'getSingleViewRecursive', file:'/data/data/org.nativescript.finlyng/files/app/tns_modules/nativescript-angular/directives/list-view-comp.js',

line: 138, column: 15 Frame: function:'getSingleViewFromViewRef', file:'/data/data/org.nativescript.finlyng/files/app/tns_modules/nativescript-angular/directives/list-view-comp.js', line: 154, column: 12 Frame: function:'ListViewComponent.onItemLoading', file:'/data/data/org.nativescript.finlyng/files/app/tns_modules/nativescript-angular/directives/list-view-comp.js', line: 72, column: 25 Frame: function:'Observable.notify', file:'/data/data/org.nativescript.finlyng/files/app/tns_modules/data/observable/observable.js', line: 146, column: 32 Frame: function:'ListViewAdap

Upvotes: 1

Views: 828

Answers (1)

moigonz
moigonz

Reputation: 76

This is pretty old but I had a similar issue.

I fixed it by nesting the Labels inside a GridLayout. Something like this in my case: 

<GridLayout rows="auto, *">
  <ListView [items]="newsList" row="1" class="news">
    <ng-template let-item="item">
      <GridLayout rows="auto, *">
        <Image [src]="item.image"></Image>
        <Label [text]="item.title" class="news__item"></Label>
      </GridLayout>
    </ng-template>
  </ListView>
</GridLayout>

Upvotes: 1

Related Questions