title: Using ng-model with mongoose schema objects inside of [ ]
body: <p>I have a fairly simple question but haven't been able to find the answer to it so far. I have a mongoose schema that is structured something like this:</p>
  
  <pre><code>var mongoose = require('mongoose');
  var schema = mongoose.Schema;
  
  var family = new schema({
      _id : String,
      members : {
          parent: [{
              name: String,
              age : Number
          }],
          child: [{
              name: String,
              age : Number
          }]
      }
  });
  </code></pre>
  
  <p>Here is the form itself:</p>
  
  <pre><code>&lt;form name="familyForm" id="familyForm"&gt;
      &lt;fieldset&gt;
          &lt;select ng-model="familyDropdown" ng-click="populateFamily()" id="familyDropdown"&gt;
              &lt;option value="new"&gt;New Family&lt;/option&gt;
              &lt;option ng-repeat="family in familyList track by family._id" bn-log-dom-creation="With" ng-model="family._id" value="{{family._id}}"&gt;{{family._id}}&lt;/option&gt;
          &lt;/select&gt;
          &lt;input type="text" id="newFamily" placeholder="Create New Family" ng-model="family._id" ng-minlength="2" /&gt;
          &lt;input type="text" id="newParent" placeholder="Add a Parent to {{ family._id }}" ng-model="family.members.parent[0].name" ng-minlength="2" /&gt;
          &lt;span class="family-box-buttons"&gt;
              &lt;button type="submit" class="green-button" ng-click="addFamily(family)" ng-disabled="familyForm.$invalid"&gt;
                  &lt;i class="fa fa-check"&gt;&lt;/i&gt;
              &lt;/button&gt;
              &lt;button type="button" class="red-button" ng-click="cancelForm()"&gt;
                  &lt;i class="fa fa-times"&gt;&lt;/i&gt;
              &lt;/button&gt;
          &lt;/span&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Here are some additional server side pieces to this puzzle:</p>
  
  <p>From my app.js</p>
  
  <pre><code>var mongoose = require('mongoose');
  var express = require('express');
  var app = express();
  
  app.get('/family', api.getFamily);
  app.post('/family/:_id', api.postFamily);
  app.delete('/family/:_id', api.deleteFamily);
  
  app.listen(3000, function(){
      console.log('connected!');
  });
  </code></pre>
  
  <p>And from my API</p>
  
  <pre><code>var Family = require('./family.js');
  
  exports.getFamily = function(req, res){
      Family.find({}, function(err, family){
          if(err){
              res.send('Family not found');
          }
          res.send(family);
      });
  };
  
  exports.postFamily = function(req, res){
      if(req.body){
          console.log(req.body);
          var family = new Family(req.body);
          family.save(function(err, family){
              if(err){
                  res.send('There was an error adding this Family');
              }
              res.send(family);
          });
      }
  };
  </code></pre>
  
  <p>My problem is I seem to be having some difficulty mapping to the schema using <code>ng-model</code> for anything encapsulated by <code>[]</code>. I can POST if I just fill out the input field with <code>family._id</code></p>
  
  <p>I have tried things like <code>ng-model="family.members.parent.name"</code> but realize that the . notation specifically grants access to object models and not array models. </p>
  
  <p>I have also tried things like <code>ng-model="family.members.parent[].name</code> and <code>ng-model="family.members.parent[name]</code>.</p>
  
  <p>I realize it must be a fairly simple mistake that I am making. If there is a better way of doing this, point me in the right direction. Any guidance would be greatly appreciated.</p>