我正在尝试使用angular1.x指令,并收到此错误:
angular.js:14700错误:[$ compile:nonassign]与指令'ngPage'一起使用的属性'showPageCount'中的表达式'undefined'是不可分配的!
好像我没有在指令中签署该财产。 我怎样才能使它有效?
NG-page.js:
angular.module('ngPage', [])
.directive('ngPage', function () {
return {
restrict: 'E',
transclude: true,
replace: true,
scope: {
pageNo: '=',
pageSize: '=',
totalCount: '=',
pageChange: "&",
showPageCount: '='
},
templateUrl: './ngPageTemplate.html',
link: function (scope, element, attrs) {
scope.showPageCount = scope.showPageCount ? scope.showPageCount : 5;
scope.pageCount = Math.ceil(scope.totalCount / scope.pageSize);
scope.hasPre = scope.pageNo > 1;
scope.preNo = scope.hasPre ? scope.pageNo - 1 : scope.pageNo;
scope.hasNext = scope.pageNo < scope.pageCount;
scope.nextNo = scope.hasNext ? scope.pageNo + 1 : scope.pageNo;
scope.goPage = function (pageNo) {
if (scope.pageNo !== pageNo) {
scope.pageNo = pageNo;
scope.pageChange();
}
};
scope.getPageList = function () {
var list = [];
if (scope.pageCount <= scope.showPageCount) {
for (var i = 1; i < scope.pageCount + 1; i++) {
list.push(i);
}
} else {
var startNo = scope.pageNo - scope.showPageCount / 2;
var endNo = scope.pageNo + scope.showPageCount / 2;
if (startNo < 1) {
//前几页
startNo = 1;
for (var i = 0; i < scope.showPageCount; i++) {
list.push(startNo++);
}
} else if (endNo > scope.pageCount) {
//后几页
endNo = angular.copy(scope.pageCount);
for (var i = scope.showPageCount; i >= 0; i--) {
list.unshift(endNo--);
}
} else {
//中间页
startNo = Math.ceil(startNo);
for (var i = 0; i < scope.showPageCount; i++) {
list.push(startNo++);
}
}
}
return list;
};
scope.pageList = scope.getPageList();
}
};
});
答案 0 :(得分:1)
您无法在指令showPageCount
函数内的指令范围内使用link
参数。如果要在链接函数中使用它,则必须将ng-model-options
中的值传递为
<input type="text" ng-model="yourModel"
ng-model-options='{ debounce: 600, showpagecount: scopecountvalue }'
ng-page/>
并使用内部指令链接函数。
.directive('ngPage', function () {
return {
require: 'ngModel',
restrict: 'AE',
link: function (scope, element, attr, ctrl) {
function inputValue(val) {
var pageCount = ctrl.$options.showpagecount;
}
ctrl.$parsers.push(inputValue);
}
};
})
现在可以在链接功能中访问该值。 希望这会对你有所帮助。
答案 1 :(得分:0)
感谢Nitheesh。
这是新代码:
HTML:
<ng-page page-no="pageNo" page-size="pageSize" page-change="pageChange($event)" total-count="totalCount" show-page-count="6"></ng-page>
范围内指令:
scope: {
pageNo: '=',
pageSize: '=',
totalCount: '=',
pageChange: "&",
showPageCount: '@'
}
链接中的goPage函数:
scope.pageChange({$ event:{pageNo:pageNo}});