Not working in TNS 2.5

[elvismercado]

file:///app/tns_modules/nativescript-pulltorefresh/pulltorefresh.js:65:71: JS ERROR Error: Content must inherit from UIScrollView!

[bradmartin]

That's a layout issue. Can you provide your UI markup?

[elvismercado]

Essentially the same example on the github page is within the schedules directive

<GridLayout>
	<TabView #tabView class="tab-view" [selectedIndex]="tabindex" (selectedIndexChanged)="onSelectedIndexChanged(tabView.selectedIndex)">
		<GridLayout *tabItem="{title: 'Planning'}">
			<schedules></schedules>
		</GridLayout>
	</TabView>
</GridLayout>

[bradmartin]

Is the refresh inside the schedules?

…

On Tue, Feb 7, 2017, 6:33 AM Elvis Mercado ***@***.***> wrote: Essentially the same example on the github page is within the schedules directive <GridLayout> <TabView #tabView class="tab-view" [selectedIndex]="tabindex" (selectedIndexChanged)="onSelectedIndexChanged(tabView.selectedIndex)"> <GridLayout *tabItem="{title: 'Planning'}"> <schedules></schedules> </GridLayout> </TabView> </GridLayout> — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#18 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AFulhOEhh8BuLHy-OrE3guRp7VtYDrfDks5raGSPgaJpZM4L5SMs> .

[elvismercado]

yes, this is the view of the schedules
Do you have an example which uses nativescript/angular2?

<stack-layout>   
        <PullRefresh refresh="refresh()">
        	<GridLayout>
				<ListView>
				</ListView>
			</GridLayout>
        </PullRefresh>
</stack-layout>


	refresh() {
		alert("Hello World!")
	}

[elvismercado]

@bradmartin I got the view to work. Problem was the gridlayout between the pulltorefresh and listview directive

But, i cannot get the refresh event to work

[bradmartin]

Also you have a grid-stack-schedules which doesn't seem necessary at quick glance. That might be causing an issue. I forget the specifics with the layouts on iOS and making this work. I've encountered it before and just tweaking the layout resolves the issue. I just never know what it is exactly :) I don't do a lot of iOS so I just get it working and move on. I'll ping Peter later or you can on the issue and see if he has any thoughts from your code.

[elvismercado]

Yes right. The listview needs to be a direct child of PullToRefresh I got the correct syntax now for angular2. Maybe you should include this in your readme for angular2

main.ts
import {registerElement} from "nativescript-angular/element-registry";
registerElement("PullToRefresh", () => require("nativescript-pulltorefresh").PullToRefresh);

component.html
<PullToRefresh (refresh)="refresh($event)">
    <ListView>
    </ListView
</PullToRefresh>

component.ts
refresh(args) {
    let pullRefresh = args.object;
    alert("Hello World!");
    pullRefresh.refreshing = false;
}

[bradmartin]

So it's working now? If so I can add it to the README or if you want to submit a PR with that below the plain NS sample that would be great 😄

[elvismercado]

I think an example in the readme is ok. If i ever get to check dive deeper in the code i'll create a PR

[hasbyalkaff]

hello, help me, i got same issue with this. Im use pulltorefresh, to get data from db and check them with current data.. not for listview..

this work perfectly for Android, but not for IOS. 😢

Here my code:

my UI.xml

<page navigatedTo="onNavigatedTo"
    xmlns:PR="nativescript-pulltorefresh">

    <ActionBar title="RAN1" class="action-bar">
    </ActionBar>

    <PR:PullToRefresh refresh="onRefresh">    
        <grid-layout rows="auto,*" columns="*">
            <stack-layout col="0" row="0" class="ads" >
                <label class="tanya" text="{{ question }}" textWrap="true" />
            </stack-layout>

            <stack-layout col="0" row="1" class="content" visibility="{{ showForm ? 'visible' : 'collapsed' }}">
                <label class="label" text="Your Answer :" />
                <grid-layout rows="auto, auto" columns="*, *" visibility="{{ showEssay ? 'visible' : 'collapsed' }}">
                    <text-field row="0" colSpan="2" id="answer" />
                    <button row="1" col="1" text="Lock" tap="onLock" horizontalAlignment="right" />
                </grid-layout>

                <grid-layout rows="auto" columns="*, *" visibility="{{ showOption ? 'visible' : 'collapsed' }}">
                    <button row="0" col="0" tap="onTapA" text="{{ option_a }}" />
                    <button row="0" col="1" tap="onTapB" text="{{ option_b }}" />
                </grid-layout>
            </stack-layout>
        </grid-layout>
    </PR:PullToRefresh>
</page>

my controller.js

function onRefresh(args){
    var pullRefresh = args.object;
    statusChecker.start().then(function(bool){
        pullRefresh.refreshing = false;
        if(bool){
            condition = statusChecker.getStatusClass();
            setQuestion();
        }
        else alert("Failed. Check your connection!");
    });
}