Raddy Raddy -5 years ago 251
AngularJS Question

Unknown provider: $routeParamsProvider <- $routeParams

I am currently learning AngularJS & Ionic by creating a simple podcast app.
I am trying to use routeParams to get the "itemId" but I am getting the following error:

Error: [$injector:unpr] Unknown provider: $routeParamsProvider <- $routeParams <- DetailsController

Now this is how I pass the "itemId"

.state('ted', {
url: '/ted/:itemId',
templateUrl: 'templates/ted-talks.html',
controller: 'DetailsController'

and here is my controller:

starter.controller("DetailsController", ["$scope", "$routeParams", "$http", function ($scope, $routeParams, $http) {
$http.get('http://api.npr.org/query?id=57&apiKey={I've taken the ID off})
.success(function(data, status, headers, config){
var x2js = new X2JS();
var jsonOutput = x2js.xml_str2json(data);

$scope.stories = jsonOutput.nprml.list.story;

if($routeParams.itemId) {
console.log('Single page id' + $routeParams.itemId);

.error(function(data, status, headers, config){
alert('There is a problem');

Any ideas what causes this error? I belive that the routeParams is already included in the ionic framework as the demos they provide seem to work, bu I can't figure out how.

Any help is much appreceated :)

Answer Source

As you are using Angular-ui-router you should use $stateParams dependency instead of $routeParams which are meant to use for ui-router(Angular ui-router $stateProvider)

if($stateParams.itemId) {
    console.log('Single page id' + $stateParams.itemId);

$routeParams is available there for ngRoute module(AngularJS routing $routerProvider)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download