samedi 29 avril 2017

Ember JS - Cannot read property 'save' of undefined

In a nutshell, I have created a record ("claimant") in the model hook of a route, but when I try to get the "claimant" record in the actions handler, Ember says the record doesn't exist. As a result, when I try to save "claimant," Ember tells me that it "Cannot read property 'save' of undefined." My guess it is a problem with my initializer, but I'm stumped as to why.

Any help would be tremendously appreciated. Thanks!

The relevant code is as follows:

models/claimant.js

import attr from 'ember-data/attr';
import DS from 'ember-data';
import { belongsTo } from 'ember-data/relationships';

export default DS.Model.extend({
first_name: attr('string'),
submission: DS.belongsTo('submission', {async: false}),
});

models/submission.js

import DS from 'ember-data';
import { belongsTo } from 'ember-data/relationships';

export default DS.Model.extend({
claimant: belongsTo('claimant', {async: false}), 
});

routes/claimant.js

import Ember from 'ember';

export default Ember.Route.extend({
actions: {
    next: function() {
        let claimant = this.get('claimant');
        claimant.save().then(claimant => {
            this.get('submission').createSubmission({
            claimant: claimant
            });
        });
        this.transitionTo('defendant');
    },
},

model() {
    let claimant = this.get('store').createRecord('claimant', {
        first_name: this.get('first_name'),
        });
    return claimant;
}
});

NOTE: If I instead use let claimant = this.get('controller.model'); the record saves properly, but then the BelongsTo relationship between "submission" and "claimant" doesn't properly set. Not sure why.

initializers/submission-initializer.js

import Ember from 'ember';
const {isNone, isEmpty, merge} = Ember;

let submissionProxy = Ember.ObjectProxy.extend({
_currentSubmission: null,
_store:null,

content: function() {
    let currentSubmission = this.get('_currentSubmission');

    if (isEmpty(currentSubmission)) {
    currentSubmission = this.createSubmission();
    }
     return currentSubmission;
    }.property('_currentSubmission'),

current: Ember.computed.alias('content'),

createSubmission(data = {}) {

    let newSubmission = this.get('_store').createRecord('submission', data);   
    this.set('_currentSubmission', newSubmission);
    return newSubmission;
},
});

export function initialize(application) {
application.register('submission:proxy', submissionProxy, {singleton: true});
application.inject('submission:proxy', '_store', 'service:store');
application.inject('component', 'submission', 'submission:proxy');
application.inject('route', 'submission', 'submission:proxy');
application.inject('controller', 'submission', 'submission:proxy');
};

export default {
name: 'submission-initializer',
after: ['ember-data'],
initialize: initialize
};

templates/claimant.hbs

<h2 id="title">Welcome to the Claimant Page!</h2>

<form>
<div class="form-group">
  <label for="first_name">First Name</label>
  
</div>

<button class="btn btn-primary" >Next</button>
</form>




Aucun commentaire:

Enregistrer un commentaire