zoukankan      html  css  js  c++  java
  • ionic js

    1.在tabs导航中,部分子页面隐藏底部选项卡

    tabs添加:

    <ion-tabs class="tabs-icon-top tabs-light " ng-class="{'tabs-item-hide': $root.hideTabs}">

    要隐藏选项卡的子页面:

    <ion-nav-view hide-tabs="true" >
        <ion-header-bar  hide-tabs="true">

    direction:

    app.directive('hideTabs', function ($rootScope) {
        return {
            restrict: 'A',
            link: function (scope, element, attributes) {
                scope.$on('$ionicView.beforeEnter', function () {
                    scope.$watch(attributes.hideTabs, function (value) {
                        $rootScope.hideTabs = value;
                    });
                });
                scope.$on('$ionicView.beforeLeave', function () {
                    $rootScope.hideTabs = false;
                });
            }
        };
    });

    2.设置导航的过渡方向:

    nav-direction="forward"  //back

    JS中:注入

    $ionicViewSwitcher

    使用:

    $ionicViewSwitcher.nextDirection("forward");

    3.下拉刷新

     <ion-refresher pulling-text="下拉刷新" on-refresh="shuaxin()"></ion-refresher>
     $scope.shuaxin = function () {
            $scope.items = [//新items]
            $scope.$broadcast('scroll.refreshComplete');
        }

    4.滚动条到底加载

     <ion-infinite-scroll on-infinite="loadMore()" distance="1%"></ion-infinite-scroll>
    $scope.loadMore = function () {
            $scope.items = [];
            $scope.$broadcast('scroll.infiniteScrollComplete');
        };

      $scope.$on('stateChangeSuccess', function () {
              $scope.loadMore();
    });

     
  • 相关阅读:
    Linux(CentOS 7)iptables防火墙
    Linux(CentOS 7)DNS服务器搭建
    Linux(CentOS 7)LNMP环境搭建
    Linux(CentOS 7)nginx网站服务器
    Linux(CentOS 7)LAMP环境的搭建
    JavaScript 中repalce的使用
    DOM&BOM
    CSS颜色
    CSS中的单位
    Grid Layout 注释
  • 原文地址:https://www.cnblogs.com/m110/p/8846782.html
Copyright © 2011-2022 走看看