один контроллер для нескольких страниц

Question

я сделал один сайт с маршрутами от $ routeProvider, я сделал контроллер для каждой страницы, и он выглядит так:

   myApp.config(function ($routeProvider) {
     $routeProvider
         
         .when('/category/Web development', {
            templateUrl: 'pages/web-dev.html',
            controller: 'catCtrl'
        })
         .when('/category/Game Programming', {
            templateUrl: 'pages/game-programming.html',
            controller: 'catCtrl2'
        })
     
     myApp.controller('catCtrl', function ($scope, $http) {
        $http.get("http://localhost/biblioteka/public/index/web-dev")
         .then(function (response) {
            $scope.books = response.data;
     });
 $http.get("http://localhost/biblioteka/public/category" )
     .then(function (response) {
         $scope.categories = response.data;
     });
     $scope.login = false;
     $scope.hideLogin = true;
     $scope.showLoginDiv = function() {
        $scope.login = $scope.login? false : true;
        $scope.hideLogin = $scope.hideLogin? false : true;
     };
     $scope.closeLoginDiv = function () {
        $scope.login  = false;
        $scope.hideLogin = true;
     };
     $scope.isPassword = function () {
         if ($scope.passwordValidation === "123456789") {
            $scope.login  = false;
            $scope.hideLogin = true;
            
         } else  {
            alert("Wrong password. Try again!");
         };
     };
   });
 myApp.controller('catCtrl2', function ($scope, $http) {
   $http.get("http://localhost/biblioteka/public/index/game-programming")
    .then(function (response) {
        $scope.books = response.data;
    });
 $http.get("http://localhost/biblioteka/public/category")
    .then(function (response) {
        $scope.categories = response.data;
    });
    $scope.login = false;
    $scope.hideLogin = true;
    $scope.showLoginDiv = function() {
       $scope.login = $scope.login? false : true;
       $scope.hideLogin = $scope.hideLogin? false : true;
    };
    $scope.closeLoginDiv = function () {
       $scope.login  = false;
       $scope.hideLogin = true;
    };
    $scope.isPassword = function () {
        if ($scope.passwordValidation === "123456789") {
           $scope.login  = false;
           $scope.hideLogin = true;
           
        } else  {
           alert("Wrong password. Try again!");
        };
    };
  });

как вы можете видеть, оба контроллера имеют одинаковое содержимое, но я хотел бы сделать только один контроллер для разных страниц, какой-нибудь совет, как мне это сделать? я попытался установить тот же контроллер в $ routeProvider, но он не работает :(

Answer 1

Я думаю, что ваш лучший подход будет выглядеть примерно так:

myApp.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/category/:category', {
    templateUrl: function (urlattr) {
        return '/category/' + urlattr.category + '.html';
    },
    controller: 'CategoryController',
    controllerAs: 'categoryCtrl'
  }).otherwise({
    redirectTo: '/category/web_development'
  });
}]);
myApp.controller('CategoryController', ['$routeParams', '$http', function ($routeParams, $http) {
    var categoryCtrl = this;
  // Use $http based on $routeParams.category
}]);