title: Saving relationships in Ember.js and emberFire
body: <p>Lets say I have two models, <code>Book</code> and <code>Chapter</code>.</p>
  
  <pre><code>App.Book = DS.Model.extend
    name: DS.attr 'string'
    chapters: DS.hasMany 'chapters', async: true
  
  App.Chapter = DS.Model.extend
    name: DS.attr 'string'
    book: DS.belongsTo 'book', async: true
  </code></pre>
  
  <p>Using emberFire.</p>
  
  <pre><code>App.ApplicationAdapter = DS.FirebaseAdapter.extend
    firebase: new Firebase('http://&lt;my-firebase&gt;.firebaseio.com/')
  
  App.ApplicationSerializer = DS.FirebaseSerializer.extend()
  </code></pre>
  
  <p>According to <a href="https://github.com/firebase/emberFire#relationships" rel="nofollow">the documentation on relationships</a>, using the <code>async: true</code> option, Firebase would expect my data to look something like the following.</p>
  
  <pre><code>{
    'books': [{
      'book_id_1': {
        'name': 'Example',
        'chapters': [{
          'chapter_id_1': true
        }]
    }],
    'chapters': [{
      'chapter_id_1': {
        'name': 'Chapter 1'
      }
    }]
  }
  </code></pre>
  
  <p>I can save a <code>Chapter</code> just fine, however I can't seem to get the <code>chapters</code> property of a <code>Book</code> populated with a newly created <code>Chapter</code>.</p>
  
  <p>In the chrome console:</p>
  
  <pre><code>var store = App.__container__.lookup('store:main')
  store.find('book', 'book_id_1').then(function(b) { window.book = b });
  
  var chapter = store.createRecord('chapter', { name: 'Chapter 1' });
  
  chapter.save().then(function() {  // Saves the chapter
    book.get('chapters').then(function(chapters) {
      chapters.addObject(chapter);
      book.save();  // Doesn't append to the chapters object
    }
  });
  </code></pre>
  
  <p>The above code does <em>not</em> save the <code>chapters</code> property on the <code>book</code> the way I would expect it to. Any help would be appreciated.</p>
  
  <hr>
  
  <h2><strong>EDIT</strong></h2>
  
  <p>It looks like the proper way to add the <code>chapter</code> object to the <code>book.chapters</code> property is:</p>
  
  <pre><code>book.get('chapters').then(function(chapters) {
    chapters.addObject(chapter);
    book.save().then(function() {
      chapter.save();
    });
  });
  </code></pre>
  
  <p>But if there are validation errors on the <code>chapter</code> object, it will be added to the <code>book.chapters</code> property but won't be saved (creating an invalid reference). How do you get around this?</p>