Currently, I am using Angular's $routeProvider and $locationProvider to navigate through an SPA. I am having difficulty figuring out how to apply JavaScript functionality across different pages using a controller. Whenever I switch pages, the JavaScript controller does not seem to run as expected. Below is an example that showcases this issue. The script is referenced from mainScript.js
app.config(['$routeProvider', '$locationProvider', function ($routeProvider,
$locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider.when("/", {
templateUrl: "partials/home.html"
, controller: "PageCtrl"
})
// Pages
.when("/pricing", {
templateUrl: "partials/pricing.html"
, controller: "PageCtrl"
})
.otherwise("/404", {
templateUrl: "partials/404.html"
, controller: "PageCtrl"
});
}]);
app.controller('PageCtrl', function ( $scope ) {
$scope.menuCtrl = function(){
// Implement code to be executed across pages
}
$scope.menuCtrl();
});
}());