title: $resource relations in AngularJS
body: <p>The usual way of defining an isolated resource in AngularJS is:</p>
  
  <pre><code>angular.service('TheService', function($resource){
    return $resource('api/url');
  });
  </code></pre>
  
  <p>I'm trying to figure out the best way to write a model that relates to other models, such as an <code>Order</code> that has 1 or more <code>OrderItem</code>s. My first idea is this:</p>
  
  <ol>
  <li>Create the <code>OrderService</code> and <code>OrderItemService</code> as independent resource models</li>
  <li>Write a controller that queries the <code>OrderService</code> and watches the result array</li>
  <li>When the result array changes, query the <code>OrderItemService</code> for all of the item IDs and decorate the <code>order</code> object with extended information as it comes in</li>
  </ol>
  
  <p>That seems a bit messy. Is there a more elegant way?</p>