title: Angular JS detailed view with only one json
body: <p>I'm introducing in Angular with its Tutorial "Phonecat".
  Against the tutorial I'd like to build a simple app with a list and detail view with only one json, containing all informations.</p>
  
  <p>The list-view (showing complete content of the json) works fine but I'm struggle with how to set my Angular services for the detail-view.
  I am using the XHR method:</p>
  
  <p>Controller.js:</p>
  
  <pre><code>function PlaygroundDetailCtrl($scope, Playground) {
    $scope.playgrounds = Playground.query();
  }
  </code></pre>
  
  <p>Services.js</p>
  
  <pre><code>angular.module('playgroundcatServices', ['ngResource']).
      factory('Playground', function($resource){
    return $resource('playgrounds/playgrounds.json', {}, {
      query: {method:'GET', isArray:true}
    });
  });
  </code></pre>
  
  <p>playground.json</p>
  
  <pre><code> [ 
     { 
       "id:" 1,
       "properties": "true"
       "lat": "51.347789"
       "lon": "12.232234"
     },
     {
       "id:" 2,
       "properties": "false"
       "lat": "51.347789"
       "lon": "12.766667"
     }
  ]
  </code></pre>
  
  <p>I want Angular to display only one entry (id:1) with its properties.
  What is the smartest way to do that: showing again all and then filter? </p>
  
  <p>I am stumped.</p>