title: Angular Js: Getting data from URL via $routeParams & $scope
body: <p>I have an issue trying to pass some data from my URL using $routeParams in a $scope in Angular Js. Here is my HTML partial:</p>
  
  <pre><code> &lt;h1&gt;This is: {{project[currentCat].id}}&lt;/h1&gt;  //works
   &lt;h3&gt;test: {{project[currentCat].examples[currentEx].id}}&lt;/h3&gt; //doesn't
   &lt;h2&gt;Category: {{project[currentCat].id | capitalize}}&lt;/h2&gt;
  </code></pre>
  
  <p>The h1 tag works as I have it set up in my Javascript as so:</p>
  
  <pre><code>categoryControllers.controller('DataController', ['$scope', '$http','$routeParams',      function($scope, $http, $routeParams) {
  $http.get('json/data.json').success(function(data) {
  $scope.project = data;
  $scope.currentCat = $routeParams.cat; //works
  $scope.currentEx = $routeParams.ex; //works but unable to get data
  </code></pre>
  
  <p>And my app config:</p>
  
  <pre><code>.when('/:cat', {
    templateUrl: 'partials/details.html',  //works
    controller: 'DataController'
  })
  .when('/:cat/:ex', {
    templateUrl: 'partials/example.html',  //routes correctly but unable to get data
    controller: 'DataController'
  </code></pre>
  
  <p>})</p>
  
  <p>And lastly my JSON structure:</p>
  
  <pre><code>{
  "animation":{
      "id":"animation",
      "desc":"This is a description of animation",
      "images":{
          "src":"images/animation.jpg",
          "alt":"Animation image"
      },
      "examples":[
          {
              "id":"example1",
              "name":"animation project 1",
              "category":"animation",
          }
      ]
  },
  </code></pre>
  
  <p>Basically I want to be able to pull all data associated with the example based on it's name in the URL but not sure how to formulate the part below.</p>
  
  <pre><code>&lt;h3&gt;test: {{project[currentCat.id].examples[currentEx].id}}&lt;/h3&gt;
  </code></pre>
  
  <p>Edit: Here is the HTML from the previous partial containing the link:</p>
  
  <pre><code>&lt;li ng-repeat="example in project[currentCat].examples"&gt;
    &lt;a href="#/{{project[currentCat].id}}/{{example.id}}"&gt;
      &lt;img ng-src="images/{{item.id}}.jpg" alt="Photo of {{example.name}}"&gt;&lt;/img&gt;
      &lt;div&gt;
        &lt;h2&gt;{{example.name}}&lt;/h2&gt;
        &lt;h3&gt;{{example.level}}&lt;/h3&gt;
        &lt;h3&gt;{{example.desc}}&lt;/h3&gt;
        &lt;h3&gt;{{item.Description}}&lt;/h3&gt;
      &lt;/div&gt;
    &lt;/a&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>Any help would be greatly appreciated!</p>