title: can't add relational data with angular and mongodb
body: <p>I have a view where I list 'Transporters'. A transporter has hany 'Deliveries', so I'd like to add Deliveries to respective Transporters.</p>
  
  <p>I am using express, mongoose and angular.js. I have two model definitions:</p>
  
  <pre><code>// app/models/transporter.js
  var Delivery = require('./delivery');
  
  var transporterSchema = new mongoose.Schema({
      name: String,
      natl_id_num: String,
      phone: String,
      deliveries: [Delivery]
  });
  
  var Transporter = mongoose.model('Transporter', transporterSchema);
  
  
  // app/models/delivery.js
  var Transporter = require('./transporter.js');
  
  var deliverySchema = new mongoose.Schema({
      date: { type: Date, default: Date.now },
      transporter: [Transporter],
      amount: Number
  })
  
  var Delivery = mongoose.model('Delivery', deliverySchema);
  </code></pre>
  
  <p>Then I have a view with an input field and button for each transporter:</p>
  
  <pre><code>&lt;tr ng-repeat="t in transporters track by $index"&gt;
      &lt;td&gt;{{t.name}}&lt;/td&gt;
      &lt;td&gt;{{t.deliveries.length}}&lt;/td&gt;
      &lt;td&gt;
          &lt;input type="text" placeholder="amount" ng-model="deliveryAmount"&gt;
      &lt;/td&gt;
      &lt;td&gt;
          &lt;button type="submit" ng-click="addDelivery(deliveryAmount, t)"&gt;Add&lt;/button&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>When I click the button I would like to add a new delivery for that Transporter. Here is the corresponding controller:</p>
  
  <pre><code>$scope.addDelivery = function(deliveryAmount, transporter){
              var data = {};
              data.date = Date.now();
              data.amount = deliveryAmount;
              data.transporter = transporter;
              console.log('data equals: ' + data.transporter);
  
              $http({
                  url: '/api/deliveries', 
                  data: data,
                  method: 'POST',
                  headers: {'Content-Type': 'application/x-www-form-urlencoded'}
              })
                  .success(function(data, status, headers, config){
                      $('input').val('');
                      console.log(data + ' added');
                  })
                  .error(function(data){
                      console.log('couldn\'t post delivery: ' + err);
                  });
          };
  </code></pre>
  
  <p>However, when I list all deliveries, the transporter and amount properties are not there. In the controller there is:</p>
  
  <pre><code>$http.get('/api/deliveries')
          .success(function(data){
              // add all deliveries to deliveries scope
              $scope.deliveries = data;
          })
  </code></pre>
  
  <p>And in the view there is:</p>
  
  <pre><code>&lt;p ng-repeat='d in deliveries'&gt;{{ d }}&lt;/p&gt;
  </code></pre>
  
  <p>But that outputs:</p>
  
  <pre><code>{"_id":"52f9f0e5156c0f6303d846ef","__v":0,"transporter":[],"date":"2014-02-11T09:44:05.619Z"}
  </code></pre>
  
  <p>Instead of showing the amount and the transporter as specified with the <code>addDelivery</code> function</p>
  
  <p>My REST API for deliveries is shown here:</p>
  
  <pre><code>// all deliveries
  app.get('/api/deliveries', function(req, res){
      Delivery.find(function(err, deliveries){
          if(err) res.send(err);
  
          res.json(deliveries);
      });
  });
  
  // create delivery
  app.post('/api/deliveries', function(req, res){
      Delivery.create({
          date: req.body.date,
          transporter: req.body.transporter,
          amount: req.body.amount
      }, function(err, delivery){
          if(err) res.send(err);
  
          Delivery.find(function(err, deliveries){
              if(err) res.send(err);
  
              res.json(deliveries);
          });
      });
  });
  </code></pre>