angularjs - AngularJS が $routeParams を使用してスラッグで単一の投稿を取得すると失敗する

Question

私は小さな AngularJS ブログ アプリに取り組んでいます (私が使用しているフレームワークのバージョンは 1.7.8 です)。

自分で作成した API から投稿を取得して表示することができました。

1つの投稿の表示に問題があり、その原因がわかりません。

私の app.js ファイル:

angular.module('app', [
    'ngRoute',
    'app.controllers',
    'ngSanitize'
]).config(['$routeProvider', function($routeProvider){
    $routeProvider.when('/', {
        templateUrl: 'templates/posts.html',
        controller: 'PostsController'
    }).when('/:slug', {
        templateUrl: 'templates/singlepost.html',
        controller: 'SinglePostController'
    }).when('/page/:id', {
        templateUrl: 'templates/page.html',
        controller: 'PageController'
    }).otherwise({
        redirectTo: '/'
    });
}]);

私の 2 つのコントローラーのうち、最初のコントローラーのみが必要に応じて機能します。

// All posts
.controller('PostsController', ['$scope', '$http', function($scope, $http){
    $http.get('api').then(function(response) {

        //Categories
        $scope.categories = response.data.categories;

        // Posts
        $scope.posts = response.data.posts;

        // Pages
        $scope.pages = response.data.pages;

    });
}])

// Single post
.controller('SinglePostController', ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams){
    $http.get('api/{slug}').then(function(response) {

        const slug = $routeParams.slug;
        console.log(slug); //consoles the slug post
        console.log(response.data.post); //consoles null

    });
}])

コンソールにSinglePostController表示されますpost: null。特に次の理由から、それは私を困惑させます。

1. console.log(slug);コンソールに投稿スラッグを表示します。
2. 実際のスラッグ ("the-future-of-oil" など) に置き換える{slug}と、コンソールに単一の投稿データが表示されます。

私の間違いはどこですか？