ionic瀑布流

首先使用這個插件:
https://github.com/zedwang/angular-waterfall

更改部分代碼,獲得兼容性

if (scope.$last === true) {
                        angular.element(element).ready(function() {
                            var img = element.find("img")[0];
                            var oImage = new Image();

                          if (oImage.complete) {
                            //$timeout.cancel();
                            //$timeout(function(){
                            scope.$emit("waterfall:repeatFinished");
                            //},500);
                          }else {
                            oImage.onload = function () {
                              scope.$emit("waterfall:repeatFinished");
                            };
                          }
                          oImage.src = img.src;
                        });
                    }
  $rootScope.$on("waterfall:repeatFinished",function(){
                        $timeout.cancel();
                      $timeout(function(){
                        waterfall(scope.minCols);
                      },500)
                    });

如果不需要點擊按鈕加載更多功能,則下拉刷新和上拉加載依舊使用ionic指令,不過要注意上拉加載的觸發需要在數據變更後加一段時間的延遲

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章