title: How to pass stateParams to the angular controller?
body: <p>I try to define stateParams in the controller, but it returns me an empty object {}</p>
  
  <p>My app.js:</p>
  
  <pre><code>angular.module('testApp', ['ui.router','ngResource'])
  .config(function($stateProvider, $urlRouterProvider) {
      $stateProvider
          .state('app', {
              url:'/',
              views: {
                  'header': {
                      templateUrl : 'views/header.html'
                  },
                  'messages': {
                      templateUrl : 'views/messages.html',
                      controller  : 'MessageController'
                  },
                  'chat': {
                      templateUrl : 'views/chat.html',
                      controller  : 'ChatController'
                  },
                  'footer': {
                      templateUrl : 'views/footer.html'
                  }
              }
          })
          .state('app.chat', {
              url: ':id'
          });
          $urlRouterProvider.otherwise('/');
  })
  </code></pre>
  
  <p>My controller.js:</p>
  
  <pre><code>angular.module('testApp')
  
  .controller('IndexController', ['$scope', '$stateParams', function($scope,$stateParams) {
  
      $scope.chosenMessage = $stateParams;
  
  }]);
  </code></pre>
  
  <p>And my template:</p>
  
  <pre><code>        &lt;div ui-view="messages" class="col-xs-6"&gt;&lt;/div&gt;
          &lt;div ui-view="chat" class="col-xs-6"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I need an id from StateParams to define choosen message and chat content for the message.</p>