title: can't get the value of $stateParams in controller
body: <p>
  I am trying to get the value of <code>$stateParams</code> in my <code>controller</code> but it is always <strong>undefined</strong> but I can see there is a value in my <code>view</code>.</p>
  
  <p><a href="https://i.stack.imgur.com/QDZPg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QDZPg.png" alt="stateparams value in view"></a>
  As you can see there are values on each <code>link</code>.
  </p>
  
  <p><strong>app.js</strong></p>
  
  <pre><code>   .state('app.help', {
          url: '/help',
          views: {
            'menuContent': {
              templateUrl: 'templates/help.html'
            }
          }
        })
        .state('app.help-replies', {
          url: '/help/:id',
          views: {
            'menuContent': {
              templateUrl: 'templates/help-replies.html'
            }
          }
    })
  </code></pre>
  
  <p><strong>html view</strong></p>
  
  <p><em>this is the where the lists of data displays</em></p>
  
  <pre><code>  &lt;div ng-repeat="x in helpData"&gt;
      &lt;a class="row responsive-xs" href="#/app/help/{{x.id}}"&gt;
        &lt;div class="col"&gt;&lt;h6&gt;{{x.subject}}&lt;/h6&gt;&lt;/div&gt;
      &lt;/a&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p><em>this is where the single view of the <code>clicked</code> data in the above <code>view</code>.</em>  </p>
  
  <pre><code> &lt;div class="row responsive-xs" ng-init="viewHelpAndReplies()"&gt;
        &lt;div class="col"&gt;
          &lt;h5&gt;Subject: {{$scope.help_id}}&lt;/h5&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p><strong>controller.js</strong></p>
  
  <pre><code>  $scope.viewHelpAndReplies = function(){
      console.log($stateParams.id);
    }
  </code></pre>