[英]$routeParams gets undefined in angularjs?
I am making a call an http call to a json file. 我正在调用一个json文件的http调用。 In the first controller I get the categories , and in the second controller I get the category with a certain ID.
在第一个控制器中,我得到类别,在第二个控制器中,我得到具有特定ID的类别。
The url gets updated with an categoryid but the $routeParams is shown undefined and cannnot access the file. url使用categoryid更新,但$ routeParams显示为undefined,并且无法访问该文件。
Here is my code: 这是我的代码:
$stateProvider.state('categories', {
url: '/category',
templateUrl: 'templates/categories.html',
controller: 'CategoriesCtrl'
});
$stateProvider.state('postC', {
url: '/category/:category',
templateUrl: 'templates/postsc.html',
controller: 'PostCtrl'
});
In the controller I have the following: 在控制器中我有以下内容:
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);
})
})
}
]);
The view for the categories is the following: 类别的视图如下:
<div class="list">
<a ng-repeat="category in categories" href="#/category/{{category.id}}" class="item item-thumbnail-left">
<h2>{{category.name}}</h2>
</a>
</div>
And when I click on the category the URL becomes: http://localhost:8100/#/category/12 , but the $stateparams.category in ~/wp/v2/terms/category/" + $routeParams.category
is undefined therefor the http request cannot go through. 当我点击类别时,URL变为: http:// localhost:8100 /#/ category / 12 ,但
~/wp/v2/terms/category/" + $routeParams.category
中的~/wp/v2/terms/category/" + $routeParams.category
未定义因此http请求无法通过。
I cannot figure it out what am I missing ? 我无法弄清楚我错过了什么?
Try changing $routeParams
with $stateParams
in every instance. 尝试在每个实例中使用
$stateParams
更改$routeParams
。 You're obviously using ui-router
which uses "states", while ngRouter
uses "routes". 您显然使用
ui-router
是使用“状态”的ui-router
,而ngRouter
使用“routes”。
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);
})
})
}
]);
You might want to double-check the code near 您可能需要仔细检查附近的代码
.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. 在此处阅读有关创建Controller的语法的更多信息 。 You are missing injectors.
你缺少注射器。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.