I made a page in directive and declared a $scope.page, in controller. When I clicked on the next page, I did this $scope.page+1, in directive, but it didn"t change in controller.
but when printing in directive, the value of page changes.
the following is the relevant code.
directive:
routerApp.directive("pagination",["$http","localStorageService",function($http,localStorageService) {
return{
scope:{
refresh : "&",
count:"=",
pagesize:"=",
page:"="
},
restrict:"EAC",
replace: true,
templateUrl:"../index/page.html",
controller:function($scope,$element,$attrs,localStorageService){
$scope.totalPage=1;//
//
$scope.firstPage=function(){
$scope.page=1;
}
console.log($scope.page)
//
$scope.nextPage= function () {
var page=parseInt($scope.page)+1;
if($scope.totalPage>=page){
$scope.page=page;
console.log($scope)
}else{
//toaster.pop("error", "", "");
alert("")
}
}
//
$scope.upPage= function () {
var page=$scope.page-1;
if(page>0){
$scope.page=page;
}else{
alert("");
}
}
$scope.endPage=function(){
$scope.page=$scope.totalPage;
}
$scope.getList=function(){
if(!$scope.totalPage){}else{
var size=10;
var min=parseInt($scope.page)-1;
var max=parseInt($scope.page)+9;
if($scope.totalPage>10){
if(max>$scope.totalPage){
min=parseInt($scope.totalPage)-9;
max=$scope.totalPage;
} else{
if(min==0){
var min=$scope.page;
var max=parseInt($scope.page)+10;
}
}
}else{
size=$scope.totalPage;
min=1;
}
$scope.arrayObj = new Array([size]);//
for (var i=0;i<size; iPP)
{
$scope.arrayObj[i]={key:"dd",value:parseInt(i)+parseInt(min)};
}
}
}
$scope.$watch("page", function(newVal, oldVal) {
if($scope.totalPage>=newVal&&newVal>=1){
$scope.page=newVal;
$scope.refresh();
}else{
$scope.page=oldVal;
alert("");
}
// console.log( $scope.page);
$scope.getList();
});
//
$scope.setPage=function(page){
$scope.page=page;
}
$scope.$watch("pagesize", function(newVal, oldVal) {
$scope.refresh();
});
$scope.$watch("count", function(newVal, oldVal) {
var z =$scope.count%$scope.pagesize;
if(z==0){
if(Math.floor($scope.count/$scope.pagesize)==0){
$scope.totalPage=1;
}else{
$scope.totalPage=Math.floor($scope.count/$scope.pagesize);
}
}else{
$scope.totalPage=Math.floor($scope.count/$scope.pagesize)+1;
}
$scope.getList();
});
}
};
}]);
page.html
<div class="fy">
<ul class="clearfix">
<li><button ng-click="firstPage()"></button></li>
<li><button ng-click="upPage()"></button></li>
<li ng-repeat="i in arrayObj"><span ng-class="{"active":(page==i.value)}" ng-click="setPage(i.value)">{{i.value}}</span></li>
<li><button ng-click="nextPage()"></button></li>
<li><button ng-click="endPage()"></button></li>
<li>{{totalPage}}{{count}}</li>
<li><input type="text" ng-model="page"></li>
</ul>
</div>
controller
routerApp.controller("checkController", ["$scope","$http","localStorageService", "$filter","$location",function($scope,$http,localStorageService, $filter,$location) {
$scope.page=1;
$scope.pagesize=3;
$scope.nashuilist = function () {
console.log($scope)
//$scope.page+1 =2 1
var s=angular.element("-sharpstartTime").val();
var e=angular.element("-sharpendTime").val();
$http({
method:"GET",
url:"/api/dz/nsdz",
params:{
"startTime":s,
"endTime": e,
"nsrsbh":$scope.nsrsbh,
"page":$scope.page,
"pageSize":$scope.pagesize
},
dataType:"json"
}).success(function (resp) {
if (resp.success) {
$scope.nslist=resp.data.listData;
$scope.count=resp.data.totalRow;
} else {
console.log(resp.message)
}
}).error(function (list) {
//
console.log("")
});
}
$scope.nashuilist();
}]);
This is referenced in the page.
<pagination count="count" page="page" pagesize="pagesize" refresh="nashuilist()"></pagination>
the same code, except that the name of the method has been changed, and there will be no problem in another controller. Access to a lot of information
just contacted the front end soon, I hope God can help.