• angular.js第一个项目 简单分页


    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <meta name="apple-touch-fullscreen" content="YES">
        <meta name="format-detection" content="telephone=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta http-equiv="Expires" content="-1">
        <meta http-equiv="pragram" content="no-cache">
        <link rel="stylesheet" href="/css/group/base.css">
        <link rel="stylesheet" href="/css/group/product_list.css">
        <script type="text/javascript" src="/scripts/group/angular1.4.6.min.js"></script>
        <title>我的团</title>
    
    </head>
    <body>
    <div ng-app="myGroups" ng-controller="groupsCtrl"  when-scrolled="get_more(1)">
    <ul>
      <li>
        我的团
      </li>
      <li ng-repeat="x in groups">
         <div style="100px;float:left;">
             <img style="100px;height:100px;" src="{{ x.img_url}}" />
         </div>
         <div  style="200px;float:left;">
             <div><a href="details.aspx?groupsid={{ x.groups_Id}}">{{ x.act_name}}</a></div>
             <div>【{{ x.groups_size}}人团】</div>
             <div>{{ x.groups_price}}</div>
             <div>状态:{{ getState(x.groups_state)}}</div>
         </div>
          <div style="clear:both;"></div>
      </li>
    </ul>
        总记录:{{ totalcount}}
        总页数:{{ totalpage}}
        当前页:{{ pageindex}}
    <button ng-click="get_more(-1)">上一页</button>
    <button ng-click="get_more(1)">下一页</button>
    </div>
    
    
    <script>
        var app = angular.module("myGroups",[]);
        app.controller("groupsCtrl",["$scope","$http",function($scope,$http){
        
            $scope.api='http://localhost:48732/groups/Default/GetGroupsByMobile';
            $scope.pageindex=0;
            $scope.pagesize = 10;
            $scope.totalpage = 0;
            $scope.totalcount = 0;
            $scope.mobile = '<%=mobile%>';
            $scope.groups = [];
            $scope.getState = function (state) {
                if (state == 0) {
                    return "组团中"
                } else if (state == 1) {
                    return "已完成"
                } else {
                    return "组团失败"
                }
            }
    
            $scope.get_more = function (increase) {
                $scope.pageindex += increase;
    
                //if ($scope.pageindex<1) {
                //    $scope.pageindex = 1;
                //}
                //if ($scope.pageindex > $scope.totalpage && $scope.totalpage>0) {
                //    $scope.pageindex = $scope.totalpage;
               //}
    
                $http({
                    method: "POST", 
                    url: $scope.api,
                    data:'mobile='+$scope.mobile+'&pageindex='+$scope.pageindex+'&pagesize='+$scope.pagesize,
                    headers: {'Content-Type': 'application/x-www-form-urlencoded'
                    }
                }).
    			success(function (data, status) {
    			    if (status == 200 && data.Success == 'true') {
    			        $scope.totalpage = data.data.TotalPage;
    			        $scope.totalcount = data.data.TotalCount;
    			        for (var i = 0; i < data.data.PageData.length; i++) {
    			            $scope.groups.push(data.data.PageData[i]);
    			        }
    			        //$scope.groups = data.data.PageData;
    			    }
    			}).
    			error(function(data, status) {
    
    			});
            }//get_more END
    
            //第一次加载打开第一页数据
            $scope.get_more(1);
        }]);//controller END
    </script>
    </body>
    </html>
    
  • 相关阅读:
    C语言I博客作业05
    C语言I博客作业04
    C语言II博客作业04
    C语言II博客作业03
    C语言II博客作业02
    C语言II博客作业01
    学期总结
    C语言I博客作业07
    C语言I博客作业04
    C语言II博客作业04
  • 原文地址:https://www.cnblogs.com/westfruit/p/5177585.html
Copyright © 2020-2023  润新知