Ember - How to insert record only when save() is complete

Question

I have an application that can support multiple languages. Each of my users have their own set of "supported language". Let's say my user support english, french and spanish, he can create a category for his shop and he will have to input the name in 3 language. However, when I show the list of the categories, I only want to show in my tag the selected language name.

I made the following function in my controller and it work perfectly :

App.CategoryController = Ember.ObjectController.extend({   
    needs: ['settings'],
    currentLocale: Ember.computed.alias('controllers.settings.currentLocale'),
    name: function() {
        var translations = this.get('category_translation_ids').filterBy('locale', this.get('currentLocale'));
        Ember.assert("The selected language does not exist", translations.length === 1);
        return translations[0].get('name');
    }.property('category_translation_ids.@each.name') 
});

My problem is when I add a new category :

App.CategoriesAddController = Ember.ObjectController.extend({   
    needs: ['categories', 'settings'],
    newRecord: function() {
        scope = this;
        record = this.store.createRecord( 'category', 
                                          {
                                               active: true,
                                          })
        record.save().then(function(record) {
            scope.get('controllers.settings').get('supportedLocale').forEach(function(item, index, enumerable) {
                translation = scope.get('store').createRecord( 'categoryTranslation', 
                                                {
                                                    locale: item,
                                                    name: 'Nom',
                                                    description: '',
                                                    meta_description: ''
                                                });
                record.get('category_translation_ids').pushObject(translation);
                translation.save();
            });
        });
    },
});

As soon as I do "createRecord" my Category is created and the computed property "name" can't execute because I haven't yet inserted the translation. I have no idea if I'm doing it the right way as this is my first project in ember. I'm on this problem since that last 4-5 hours without much success. Any help would be greatly appreciated.

Answer 1

it sounds like you've got a template showing all of the categories, and the item controller for the category is CategoryController. Probably something like this:

{{#each category in controller}} 
  {{category.name}}
{{/each}}

As I'm sure is happening to you, when the controller attempts to calculate name on the controller it crashes. There are a few ways you can accomplish this, one being filtering if the category isn't new.

{{#each category in controller}} 
  {{#unless category.isNew}}
    {{category.name}}
  {{/unless}}
{{/each}}

You can also filter based on the state of the record, though that changes frequently and there are a plethora of different states.