Why am I getting "Incorrect injection token!" in this angular application code?

Question

I'm trying to setup a restful API interface via AngularJS with the following code:

'use strict';

(function(angular) {

  function ApiAction($resource, ResourceParameters) {
    return $resource(ResourceParameters.route,
      { },
      { api_index: {
        method: ResourceParameters.method,
        isArray: true 
        }
      });

    return $resource(ResourceParameters.route,
      { },
      { create: {
        method: ResourceParameters.method,
        isArray: true
        }
      }
                    );
  }

  function ResourceParameters($scope) {
    var factory = {};
    factory.method = '';
    factory.route = '';
    factory.SetMethod = function(method) {
      factory.method = method;
    }
    factory.SetRoute = function(route) {
      factory.route = route;
    }
    return factory;
  }

  function superheroCtr($scope, ApiAction, ResourceParameters) {
    $scope.superheroSubmit = function() {
     // ApiAction.create({}, { superhero_name: $scope.superheroName, age: $scope.superheroAge });
      angular.forEach($scope.superheroes, function(hero) {
  //      ApiAction.create({}, { superhero_name: hero.superhero_name, age: hero.age }); 
      });
    };
    var heroesResources = ResourceParameters($scope).SetRoute('/api/');
    var heroes = ApiAction.api_index({}, heroesResources);
    $scope.superheroes = [];
    heroes.$promise.then(function(data) {
      angular.forEach(data, function(item) {
        $scope.superheroes.push(item);
      });
    }, function(data) {
      //if error then...
    });

    $scope.appendSuperheroFields = function() {
      var i = $scope.superheroes.length + 1;
      $scope.superheroes.push({"id": i, age: "", superhero_name: "" })
    }

  }

  var superheroApp = angular.module('superheroApp', ['ngResource']);
  superheroApp.controller('superheroCtr', ['$scope', 'ApiAction', 'ResourceParameters', superheroCtr]);
  superheroApp.factory('ResourceParameters', ['$scope', ResourceParameters]);
  superheroApp.factory('ApiAction', ['$resource', ResourceParameters, ApiAction]);

})(angular);

Yet, when I run it I get the following error:

Error: [$injector:itkn] Incorrect injection token! Expected service name as string, got function ResourceParameters($scope)

Why is this?

Answer 1

Simply you can not inject $scope OR you can not have access to $scope inside a factory

Your problem is at this line

superheroApp.factory('ResourceParameters', ['$scope', ResourceParameters]);

You need to replace that line with

superheroApp.factory('ResourceParameters', [ResourceParameters]);

Factory

function ResourceParameters() { //<--removed $scope from here
    var factory = {};
    factory.method = '';
    factory.route = '';
    factory.SetMethod = function(method) {
      factory.method = method;
    }
    factory.SetRoute = function(route) {
      factory.route = route;
    }
    return factory;
}

Update

Additionally you should correct the declaration of ApiAction where ResourceParameters should be placed inside ' single qoutes

superheroApp.factory('ApiAction', ['$resource', 'ResourceParameters', ApiAction]);