title: Injected $stateParams and $state into jasmine angular js test getting undefined
body: <p>I am writing a jasmine test for my DetailCtrl. I have 10 json file each with file names like this</p>
  
  <pre><code>1.json
  2.json
  3.json
  </code></pre>
  
  <p>in my data folder</p>
  
  <p>Here is my Detail Ctrl</p>
  
  <pre><code>backpagecontrollers.controller('DetailCtrl', function($scope, $stateParams, $http) {
    $http.get('data/' +  $stateParams.listingId + '.json').success(function(data) {
        $scope.extrainfo = data; 
    });
  }); 
  </code></pre>
  
  <p>The detail controller is fetching each 1.json, 2.json, 3.json file from my data folder. </p>
  
  <p>Here is a part of my route</p>
  
  <pre><code>.state('listingdetail', {
        url: "/listings/:listingId",
        templateUrl: "partials/detail.html",
        controller: 'DetailCtrl'
      })
  </code></pre>
  
  <p>Lets head back to the test, I injected both the <code>$stateParams</code> and the <code>$state</code> into the test. </p>
  
  <p>I want to test that for each json file above the images exist inside my json file. 
  I am setting the httpbackend to get the local host url plus the listingId from the <code>$stateparams</code> which I configured as part of the routes but the <code>listingId</code> is coming back as undefined. Am I suppose to inject something else into my test?</p>
  
  <pre><code>describe('Detail Ctrl', function() {
  
        var scope, ctrl, httpBackend, stateparams, listingId; 
  
        beforeEach(angular.mock.module("backpageApp"));
        beforeEach(angular.mock.inject(function($controller, $rootScope, _$httpBackend_,    $stateParams, $state) {
          httpBackend = _$httpBackend_;
          stateparams = $stateParams; 
          listingId = stateparams.listingId;
  
          httpBackend.expectGET('http://localhost:8000/#/listings/' + listingId).respond([{id: 1 }, {id: 2}, {id:3}, {id:4}, {id:5}, {id:6}, {id:7}, {id:8}, {id:9}, {id:10}]);
          scope = $rootScope.$new(); 
          ctrl = $controller("DetailCtrl", {$scope:scope}); 
        }));
  
         it('the images for each listing should exist', function() {
          httpBackend.flush(); 
          expect(scope.images).toBe(true)
        });
      });
  </code></pre>
  
  <p>I am getting this error</p>
  
  <pre><code>Error: Unexpected request: GET data/undefined.json
      Expected GET http://localhost:8000/#/listings/undefined
  </code></pre>