我有一个 pagination包裹在 ng-if 指令中的组件。您可以在 View 绑定(bind)中看到 currentPage 的更新。 Controller 每次更改时都会记录 currentPage，但它似乎并未在 Controller 的范围内更新。 ng-if 指令是否创建了与 Controller 不同的作用域？有人可以解释为什么它没有在下面代码片段中的 pageChanged 方法中更新吗？
注意:分页组件在 ng-if 指令之外按预期工作。我只是想了解发生了什么事。
angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('PaginationDemoCtrl', function ($scope, $log) {
$scope.pageChanged = function() {
$log.log('Page changed to: ' + $scope.currentPage);
};
$scope.maxSize = 5;
$scope.totalItems = 175;
$scope.currentPage = 1;
});<!doctype html>
<html ng-app="ui.bootstrap.demo">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.2.5.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="PaginationDemoCtrl">
<hr />
<h4>Limit the maximum visible buttons</h4>
<h6><code>rotate</code> defaulted to <code>true</code>:</h6>
<div ng-if="true">
<uib-pagination total-items="totalItems" ng-model="currentPage" ng-change="pageChanged()" max-size="maxSize" num-pages="numPages" ></uib-pagination>
<pre>Page: {{currentPage}} / {{numPages}}</pre>
</div>
</div>
</body>
</html>最佳答案
我明白了，哈哈
$parent.currentPage
允许我访问父范围内的当前页面。
angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('PaginationDemoCtrl', function ($scope, $log) {
$scope.pageChanged = function() {
$log.log('currentPage is now: ' + $scope.currentPage);
};
$scope.maxSize = 5;
$scope.totalItems = 175;
$scope.currentPage = 1;
});<!doctype html>
<html ng-app="ui.bootstrap.demo">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.2.5.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="PaginationDemoCtrl">
<hr />
<h4>Limit the maximum visible buttons</h4>
<h6><code>rotate</code> defaulted to <code>true</code>:</h6>
<div ng-if="true">
<uib-pagination total-items="totalItems" ng-model="$parent.currentPage" ng-change="pageChanged()" max-size="maxSize" num-pages="numPages" ></uib-pagination>
<pre>Page: {{currentPage}} / {{numPages}}</pre>
</div>
</div>
</body>
</html>关于angular-bootstrap - ng-if 中的 Angular UI Bootstrap 分页，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43233639/