AngularJS 테이블 페이지 나누기

AngularJS에는 ExtJS처럼 성숙한 표 섹션 구성 요소가 없고 인터넷에 검색해 보았지만 비교적 완벽한 버전을 발견하지 못했기 때문에 스스로 하나 썼습니다. 부족한 점은 바로잡아 주십시오.잔말 말고 코드로 바로 올라가세요.
Paginator 플랜트 함수는 다음과 같습니다.

var servicesapp = angular.module('services', []);
servicesapp.factory('Paginator', function() {
	//        ，                   Paginator。           function，             
	return function(ds) {
		var paginator = {
			hasNextVar : false,
			next: function() {
				if(this.hasNextVar) {
					this.currentOffset += this.pageSize;
					this._load();
				}
			},
			_load: function() {
				/*                  */
				if(isFunction(ds)){
					var self = this;
					ds(this.currentOffset, this.pageSize, function(response) {
						self.currentPageItems = response.data;
						self.hasNextVar = (self.currentOffset + self.pageSize) < response.totalCount;
						self.totalCount = response.totalCount;
					});
				}else{
					this.totalCount = ds.length;
					this.currentPageItems = ds.slice(this.currentOffset, this.currentOffset+this.pageSize);
					this.hasNextVar = (this.currentOffset + this.pageSize) < this.totalCount;
				}
			},
			hasNext: function() {
				return this.hasNextVar;
			},
			previous: function() {
				if(this.hasPrevious()) {
					this.currentOffset -= this.pageSize;
					this._load();
				}
			},
			setPageSize: function(){
				this.currentOffset = 0;
				this.pageSize = Number(this.pageSizeShow);
				this._load();
			},
			setPage: function(){
				var maxPage = Math.ceil(this.totalCount/this.pageSize);
				if(this.currentPage > maxPage){
					alert('        '+maxPage);
					return false;
				}
				this.currentOffset = (this.currentPage - 1) * this.pageSize;
				this._load();
			},
			gotoFirstPage:function(){
				this.currentOffset = 0;
				this._load();
			},
			gotoLastPage:function(){
				this.currentOffset = (this.getTotalpage()-1)*this.pageSize;
				this._load();
			},
			hasPrevious: function() {
				return this.currentOffset !== 0;
			},
			getTotalpage:function(){
				return Math.ceil(this.totalCount/this.pageSize);
			},
			currentPageItems: [],
			currentOffset:0,
			totalCount:0,
			pageSize:10,
			pageSizeShow:"10",
			currentPage:1
		};
		
		//     
		paginator._load();
		return paginator;
	};
});

명령 코드는 다음과 같습니다.

servicesapp.directive('pager', ['$rootScope', function($rootScope) {
	return {
		restrict: 'A',
		scope:{__paginator:'=pageInstance'},
		template:
		' {{__paginator.totalCount}} ，  '+
        '1015203050100'+
        '  |   ：{{__paginator.currentOffset/__paginator.pageSize + 1}}/{{__paginator.getTotalpage()}} ，{{__paginator.currentOffset+1}}~{{(__paginator.currentOffset+__paginator.pageSize)>(__paginator.totalCount)?__paginator.totalCount:__paginator.currentOffset+__paginator.pageSize}}  | '+
        ''+
        ''+
        ''+
        ''+
        ''+
        '',
		link: function(scope, element, attrs) {
		}
	};
}]);

controller 코드는 다음과 같습니다.

var app = angular.module('pagedemo', ['services']);
	app.controller('page1', function($scope, $http, Paginator) {
		$scope.query = 'Testing';
		var fetchFunction = function(offset, limit, callback) {
			$http.get(getActionUrl('fatap/demo/page'), {params:{query:$scope.query, offset: offset, limit: limit}}).success(callback);
		};
		$scope.paginator = Paginator(fetchFunction);
		$scope.paginator2 = Paginator(fetchFunction);
	});

상기 코드에서 Paginator의 매개 변수는 데이터를 가져오는 함수입니다. 반환값 데이터 형식은 {totalCount:2, 데이터: [{}, {}]}입니다.또한 데이터 필드를 전방에서 페이지로 직접 전달할 수 있다. 실현 방식은 Paginator 공장 방법과 같고 데이터 파라미터를 전달하는 데이터 형식은 [{}, {}]과 같다.
html 코드 세그먼트는 다음과 같습니다.

		

		  

			
   
			
IPv4-  
			
MAC-  
			
    
		  
		
		

		  

			
{{lease.hostname}}
			
{{lease.ipaddr}}
			
{{lease.macaddr}}
			
{{lease.expires}}
		  
		
	  
      

	   

	   
 
        page-instance        pageInstance    ，               。 
  
 
  
 
      http://bijian1013.iteye.com/blog/2111118，      。