Nativescript - onItemLoading callback called twice - nativescript

Question

Have a simple NS/TS page with a ListView - the list is driven by an ObservableArray.
I add 1 entry to the array and the onItemLoading event gets called 2x.
Here's my XML
<ListView items="{{ dataItems }}"
itemLoading="{{ onItemLoading }}"
itemTap="{{ onNoteTap }}"
itemTemplateSelector="'note'">
<ListView.itemTemplates>
<template key="note">
<StackLayout>
<Label id="label"/>
</StackLayout>
</template>
</ListView.itemTemplates>
</ListView>
Here's my model class
export class NotesModel extends observable.Observable
{
public _listItemArray: ObservableArray<NoteItem>;
constructor()
{
super();
this._listItemArray = new ObservableArray<NoteItem>();
let item = new NoteItem();
item.label = "test";
this._listItemArray.push( item );
}
get dataItems(): ObservableArray<NoteItem>
{
return this._listItemArray;
}
onItemLoading( args: listviewModule.ItemEventData )
{
console.log( "onItemLoading =" + args.index + " " + args.view );
}
onNoteTap( args )
{
}
}
After I run the code, I get:
JS: constructor
JS: onItemLoading =0 StackLayout(217)#file:///app/my-notes-page.xml:39:15;
JS: onItemLoading =0 StackLayout(217)#file:///app/my-notes-page.xml:39:15;

Answer 1

This is your xml file
<ListView items="{{ dataItems }}"
itemLoading="onItemLoading"
itemTap="{{ onNoteTap }}"
itemTemplateSelector="'note'">
<ListView.itemTemplates>
<template key="note">
<StackLayout>
<Label id="label"/>
</StackLayout>
</template>
</ListView.itemTemplates>
</ListView>
This is your main.ts file code, its not the model ts
import { EventData } from 'data/observable';
import { Page } from 'ui/page';
import { HelloWorldModel } from './main-view-model';
// Event handler for Page "navigatingTo" event attached in main-page.xml
export function navigatingTo(args: EventData) {
let page = <Page>args.object;
page.bindingContext = new HelloWorldModel();
}
export function onItemLoading(args) {
console.log('Calling here ');
}