Ember 2 Submit Two Associated Models in One Form

Total Ember newb here. My back-end is written with Rails. That piece is fine, so assume all is well on the server side. Here are the specifics:

I have two models Project (Has Many Project Details) Project Details (Belongs To Project)

I have confirmed that:

1. I am able to create a new Project from my projects/new.hbs template
2. My Index route retrieves all Projects and the Project Details associated with them.
3. My Show route retrieves an individual Project and the Project Details associated with them.

What I would like to do is, submit a project model along with a project detail model from my projects/new.hbs template.

I understand that the form in new.hbs should be in a component but I am keeping it simple for now. Once, I am able to create my associated models I will work on doing the same as a form component.

Project Model

export default DS.Model.extend({
 project_details: DS.hasMany('project_detail', { async: true }),

 project_name: DS.attr('string'),
 status: DS.attr('string')
});

Project Detail Model

export default DS.Model.extend({
 project: DS.belongsTo('project', { async: true }),

 project_id: DS.attr('number'),
 feature_name: DS.attr('string'),
 hours_billed: DS.attr('number'),
 available_hours: DS.attr('number'),
 amout: DS.attr('number')
});

Projects/New.js Route

export default Ember.Route.extend({
  model: function() {
    return Ember.RSVP.hash({
      projects: this.store.createRecord('project'),
      project_details: this.store.createRecord('project_detail')
    });
  },
 actions: {
  create: function() {
    var self = this;
    this.controller.get('model').save().then(
    function() {
      self.transitionTo('projects.index');
    });
  }
 }
});

Projects/New.hbs

<form {{ action "create" on="submit" }}>
  <label for="project_name">Project Name</label>
  {{ input value=project_name }}
  <label for="status">Status</label>
  {{ input value=status }}
  <label for="feature_name">Feature Name</label>
  {{ input value=feature_name }}
  <label for="available_hours">Available Hours</label>
  {{ input value=available_hours }}
  <label for="hours_billed">Hours Billed</label>
  {{ input value=hours_billed }}
  <label for="amount">Amount</label>
  {{ input value=amount }}
  <button type="submit">Save</button>
</form>

Router.js

Router.map(function() {
  this.route('home');
  this.route('dashboard');
  this.route('login');
  this.resource('projects', function() {
    this.route('new');
    this.route('show', {path: '/:id'});
    this.route('edit', {path: '/:id/edit'});
  });
});

When I submit the form, the action appears to be called, but all data that is submitted is NULL, so evidently, my inputs are not being recognized. I have searched for a couple days and have not seen a solution for submitting multiple models. My code is a result of expanding on a standard POST along with how I handled retrieving my associated models via the RSVP Hash. Any advice would be great. Thanks!