我正在使用ng-click和ng-show进行分页。在这种情况下,当点击按钮时它继续在两个方向上创建新页面,即它继续创建空白页面。它应分别停在第一页和最后一页。在这里,我创建了三个用于分页的子页面,按钮应仅针对这三个子页面播放。 期待任何帮助。 谢谢。
<div class="container" ng-app="tabApp">
<div class="row" ng-controller="TabController">
<div class="col-md-2">
<ul class="nav nav-pills nav-stacked">
<li>
<a href ng-click="setTab(tab+1)" class="btn btn-primary btn-lg" role="button">Next</a>
</li>
<li>
<a href ng-click="setTab(tab-1)" class="btn btn-primary btn-lg" role="button">Back</a>
</li>
</ul>
</div>
<div class="col-md-8">
<div class="jumbotron">
<div ng-show="isSet(1)">
<h1>Home page</h1>
<p>Welcome to the website!</p>
<p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p>
</div>
<div ng-show="isSet(2)">
<h1>Profile page</h1>
<p>Profile information</p>
</div>
<div ng-show="isSet(3)">
<h1>Messages</h1>
<p> Some messages </p>
</div>
</div>
</div>
</div>
</div>
<script>
angular.module('tabApp', [])
.controller('TabController', ['$scope', function($scope) {
$scope.tab = 1;
$scope.setTab = function(newTab) {
$scope.tab = newTab;
};
$scope.isSet = function(tabNum) {
return $scope.tab === tabNum;
};
}]);
</script>