我有一个令人沮丧的早晨.
原文链接:https://www.f2er.com/angularjs/142194.html我有一个具有基本位置的应用程序,因此在头部是< base href =“/ my / path / fruits / index.html”/>.我正在尝试通过函数nextPage()设置分页.当我点击触发nextPage()的链接时,我使用$location.path(‘/ page /:page’).
预期行为:浏览器位置网址应更改为http:// localhost / my / path / fruits / page / 2.
实际行为:浏览器URL(非常简短地)更改为http:// localhost / my / path / fruits / page / 2,然后恢复为http:// localhost / my / path / fruits /.
注意:如果我没有使用基本位置,则似乎不会发生此行为.但是,我需要使用基本位置,因为应用程序位于服务器的子/子/子目录中.
另外:如果我设置$locationProvider.@L_301_0@Mode(false),则不会发生此行为.
难道我做错了什么?这是Angular中的错误吗?任何帮助是极大的赞赏.
这是适当的文件.
index.html的:
<!doctype html> <html ng-app="fruits"> <head> <base href="/my/path/fruits/index.html" /> <script src="angular.js"></script> <script src="script.js"></script> </head> <body> <div ng-controller="MainCntl"> <div ng-view></div> </div> </body> </html>
的script.js:
angular.module('fruits',[],function($routeProvider,$locationProvider) { $routeProvider .when('/',{ templateUrl: 'fruits.html',controller: FruitCntl,}) .when('/page/:page',}) .otherwise({redirectTo:'/'}) ; // configure html5 $locationProvider.html5Mode(true).hashPrefix('!'); }).filter('startFrom',function() { return function(input,start) { start = +start; //parse to int if (input == undefined){ input = []; } return input.slice(start); } }) ; function MainCntl($scope,$location){ angular.extend($scope,{ current_page: 1,per_page: 3,fruits: [ {name: 'Apples',color: 'red'},{name: 'Bananas',color: 'yellow'},{name: 'Oranges',color: 'orange'},{name: 'Grapes',color: 'purple'},{name: 'Blueberries',color: 'blue'},{name: 'Strawberries',{name: 'Raspberries',{name: 'Clementines',{name: 'Pears',color: 'green'},{name: 'Mangoes',color: 'orange'} ],nextPage: function(){ this.current_page++; $location.path('/page/'+this.current_page); },prevIoUsPage: function(){ this.current_page--; $location.path('/page/'+this.current_page); } }) $scope.total_pages = Math.ceil($scope.fruits.length / $scope.per_page); } function FruitCntl($scope,$location,$routeParams){ if ($routeParams.page != undefined){ $scope.current_page = $routeParams.page; } }
fruits.html(视图)
Page: <a ng-click="prevIoUsPage()" ng-show="current_page > 1">PrevIoUs</a> {{current_page}} of {{total_pages}} <a ng-click="nextPage()" ng-show="current_page < total_pages">Next</a> <div ng-repeat="fruit in fruits | startFrom:(current_page - 1)*per_page | limitTo:per_page"> {{fruit.name}} are {{fruit.color}}<br/> </div>