建站
咨詢
售后
建站咨詢
新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
angular+ionic的app如何實現(xiàn)上拉加載更新數(shù)據(jù)
小編給大家分享一下angular+ionic的app如何實現(xiàn)上拉加載更新數(shù)據(jù)，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
目前創(chuàng)新互聯(lián)已為1000多家的企業(yè)提供了網(wǎng)站建設(shè)、域名、雅安服務(wù)器托管、網(wǎng)站改版維護、企業(yè)網(wǎng)站設(shè)計、七臺河網(wǎng)站維護等服務(wù)，公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。
第一步，首先需要在
里面的屬性解釋，
ng-if 值 布爾型，如果為true，則可以觸發(fā)上拉事件
on-infinite 上拉時觸發(fā)的事件
distance 列表底部滾動到可觸發(fā)上拉事件的距離，默認為1%
icon 加載時顯示的加載圖標，默認為 'ion-loading-d'
第二步：在控制器內(nèi)書寫
$scope.hasmore = true;
定義可觸發(fā)事件的對象
然后書寫loadMore事件
//上拉事件
$scope.loadMore = function () {
$scope.dataValue.page++;
loadajax();
}然后寫loadajax事件
function loadajax() {
var dataValue = $scope.dataValue;
var ip = "http://" + $rootScope.form.ip + "/appGetpage";
var req = {
method: 'POST', //請求的方式
url: ip, //請求的地址
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
'Accept': '*/*'
}, //請求的頭，如果默認可以不寫
timeout: 5000, //超時時間，還沒有測試
data: "value=" + JSON.stringify(dataValue) //message 必須是a=b&c=d的格式
};
$http(req).success(function (data) {
if (data.data.length == 0) {
$scope.hasmore = false;//這里判斷是否還能獲取到數(shù)據(jù)，如果沒有獲取數(shù)據(jù)，則不再觸發(fā)加載事件
return;
}
$scope.items = $scope.items.concat(data.data);
}).error(function () {
console.log("err");
}).finally(function () {
$scope.$broadcast('scroll.infiniteScrollComplete');//這里是告訴ionic更新數(shù)據(jù)完成，可以再次觸發(fā)更新事件
$scope.$broadcast('scroll.refreshComplete');
});
}以上是“angular+ionic的app如何實現(xiàn)上拉加載更新數(shù)據(jù)”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學習更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
當前名稱：angular+ionic的app如何實現(xiàn)上拉加載更新數(shù)據(jù)
地址分享：http://fisionsoft.com.cn/article/giecii.html
