$routeParams wird in anglejs undefiniert?

Ich rufe einen HTTP-Aufruf an eine JSON-Datei an. Im ersten Controller bekomme ich die Kategorien und im zweiten Controller bekomme ich die Kategorie mit einer bestimmten ID.

Die URL wird mit einer Kategorie-ID aktualisiert, aber $routeParams wird undefiniert angezeigt und kann nicht auf die Datei zugreifen.

Hier ist mein Code:

$stateProvider.state('categories', {
  url: '/category',
  templateUrl: 'templates/categories.html',
  controller: 'CategoriesCtrl'
});
$stateProvider.state('postC', {
  url: '/category/:category',
  templateUrl: 'templates/postsc.html',
  controller: 'PostCtrl'
});

Im Controller habe ich folgendes:

angular.module('myapp')

.controller('CategoriesCtrl', ['$scope', '$http',
  function($scope, $http) {
    $http.get("~/wp/v2/terms/category")
      .then(function(res) {
        $scope.categories = res.data;
      })
  }
])

.controller('PostCtrl', ['$scope', '$http', '$routeParams',
  function($scope, $http, $routeParams) {
    $http.get("~/wp/v2/terms/category/" + $routeParams.category).success(function(res) {

      $scope.current_category_id = $routeParams.category;
      console.log($routeParams.category);
      $scope.pageTitle="Posts in " + res.data.name + ':';
      document.querySelector('title').innerHTML = 'Category: ' + res.data.name + ' | AngularJS Demo Theme';

      $http.get("~/wp/v2/posts/?filter[category_name]=" + res.data.name).success(function(res) {
        $scope.posts = res.data;
        console.log($scope.posts);
      })

    })
  }
]);

Die Ansicht für die Kategorien ist wie folgt:

<div class="list">
  <a ng-repeat="category in categories" href="#/category/{{category.id}}" class="item item-thumbnail-left">
    <h2>{{category.name}}</h2>
  </a>
</div>

Und wenn ich auf die Kategorie klicke, wird die URL zu: http://localhost:8100/#/category/12aber die $stateparams.category in ~/wp/v2/terms/category/" + $routeParams.category ist undefiniert, daher kann die HTTP-Anfrage nicht durchgehen.

Ich kann es nicht verstehen, was übersehe ich?

Versuchen Sie, sich zu ändern $routeParams mit $stateParams in jedem Fall. Sie verwenden offensichtlich ui-router die “Zustände” verwendet, während ngRouter verwendet “Routen”.

angular.module('myapp')

.controller('CategoriesCtrl', ['$scope', '$http',
  function($scope, $http) {
    $http.get("~/wp/v2/terms/category")
      .then(function(res) {
        $scope.categories = res.data;
      })
  }
])

.controller('PostCtrl', ['$scope', '$http', '$stateParams',
  function($scope, $http, $stateParams) {
    $http.get("~/wp/v2/terms/category/" + $stateParams.category).success(function(res) {

      $scope.current_category_id = $stateParams.category;
      console.log($stateParams.category);
      $scope.pageTitle="Posts in " + res.data.name + ':';
      document.querySelector('title').innerHTML = 'Category: ' + res.data.name + ' | AngularJS Demo Theme';

      $http.get("~/wp/v2/posts/?filter[category_name]=" + res.data.name).success(function(res) {
        $scope.posts = res.data;
        console.log($scope.posts);
      })

    })
  }
]);

Vielleicht möchten Sie den Code in der Nähe noch einmal überprüfen

.controller('PostCtrl', ['$scope','$http','$rootScope', function($scope, $http, $routeParams)

it should be

.controller('PostCtrl', ['$scope','$http','$rootScope', '$routeParams', function($scope, $http, $rootScope, $routeParams)

Read more here on syntax of creating a Controller. You are missing injectors.