ant-mobile的PullToRefresh组件的使用方法

html代码：
onRefresh：必选, 刷新回调函数
direction：拉动方向，可以是 up 或 down
endReachedRefresh：滚动到底时自动刷新（direction=down）

		<PullToRefresh (onRefresh)="pullToRefresh($event)"
                         [(ngModel)]="state.refreshState"
                         [direction]="state.direction"
                         [endReachedRefresh]="state.endReachedRefresh"
                         style="height: calc(100vh - 170px);line-height: 30px">
            //我的列表项
            <app-list [columns]="columns" [rows]="tabNameList" (showList)="showList($event)"></app-list>
          </PullToRefresh>

ts代码：

//导入组件库
import { Component, OnInit } from '@angular/core';

export class CampusSecurityPage extends BasePopComponent implements OnInit {
	 //当前页数
    public pageNumber = 1;
    //数据总页数，加载数据的地方赋值
    public totalPage;
	//初始化状态
    public state = {
        refreshState: {
        	// 刷新的状态，有三种模式
        	// deactivate（拉动刷新）、finish（完成刷新）、release（刷新中）
            currentState: 'deactivate',
            drag: false,
            //默认不自动刷新
            endReachedRefresh: false,
        },
       // 拉动方向,初始化为空，可以是 up 或 down，
       // up （阻止下拉动作）、down（阻止上拉动作）
        direction: ''
    };

	/**
     * 加载数据
     */
    pullToRefresh(event) {
         //判断当前操作是下拉还是上拉
        (event === 'down') ? this.pageNumber = 1 : this.pageNumber++;
        setTimeout(() => {
        	//刷新数据
            this.refreshData();
        }, 500);
    }
    
	/**
     * 刷新数据
     */
    refreshData() {
   		 //判断数据是否加载完毕
        if (this.totalPage < this.pageNumber) {
        	//如果数据已经加载完毕，改变当前刷新状态，阻止上拉动作
            // this.state.refreshState.currentState = 'finish';
            this.state.refreshState.currentState = 'release';
            setTimeout(() => {
                this.state.refreshState.currentState = 'finish';
            }, 1000);
            this.state.direction = 'down'
            return;
        }
        //如果数据未加载完毕，重新请求数据，url为请求地址
        this.requestData(url);   //数据请求函数
    }
}