I am currently developing an application that incorporates sliding between different views with the use of next and previous buttons for navigation. However, I am encountering an issue where the $route.next and $route.previous methods are not functioning as expected within my .run() statement, despite referencing the $ng-Route documentation.
Here is a snippet from index.html:
<!doctype HTML>
...
<button ng-click="go(prevRoute);" class="slider-left">Left</button>
<button ng-click="go(nextRoute);" class="slider-right">Right</button>
...
And here's a portion of app.js:
angular.module('myApp'
...
.config(function ($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
title: 'Home',
niceName: 'home',
templateUrl: 'views/main.html',
controller: 'MainCtrl',
controllerAs: 'main'
})
// other routing configurations
})
.run(['$rootScope', '$route', function($rootScope, $route) {
$rootScope.$on('$routeChangeSuccess', function() {
$rootScope.pageTitle = $route.current.title;
$rootScope.nextRoute = $route.next.niceName;
$rootScope.prevRoute = $route.previous.niceName;
});
}])
.controller('AppCtrl', function ($scope, $location) {
$scope.go = function ( path ) {
$location.path( path );
};
});
The problem arises when attempting to implement this feature, resulting in an error message stating "Cannot find property of undefined".