Active Model Serializer with Ember - how to add an element to the collection - ember.js

Question

I have 2 models Country and Language linked with HABTM relation.
I'm using Rails API with ActiveModelSerializer and Ember JS as frontend.
So how is it possible to add a new language to country.languages collection ?
On the Ember side I'm trying to add a new language as follows:
#router
actions: {
saveLanguage(language) {
let controller = this.get('controller');
let country = controller.get('aCountry');
country.get('languages').pushObject(language);
country.save();
}
}
This calls CountriesController#update action in Rails.
Here is how I deserialize params hash in Rails controller:
#countries_controller.rb
def country_params
ActiveModelSerializers::Deserialization.jsonapi_parse!(params)
end
And here is what it returns:
{:code=>"BE", :name=>"BELGIUM", :modified_by=>"XXX", :id=>"5", :language_ids=>["374", "231", "69"]}
So I'm getting all I need:
country ID => id=5
languages IDS => both existing ones (2) and a new one.
How to properly update the country ? Thank you.

Answer 1

I figured out hot to add/delete an item to/from a association.
So on Ember side it looks like that:
actions: {
deleteLanguage(language) {
let controller = this.get('controller');
let country = controller.get('aCountry');
country.get('languages').removeObject(language);
country.set('modifiedBy', this.get('currentUser.user').get('username'))
country.save();
},
saveLanguage(language) {
let controller = this.get('controller');
let country = controller.get('aCountry');
country.get('languages').pushObject(language);
country.set('modifiedBy', this.get('currentUser.user').get('username'))
country.save();
}
And on the Rails side everything happens in the CountriesController:
class CountriesController < ApplicationController
...
def update
if #country.update(country_params)
json_response #country
else
json_response #country.errors, :unprocessable_entity
end
end
private
def find_country
#country = Country.includes(:languages).find(params[:id])
end
def country_params
ActiveModelSerializers::Deserialization.jsonapi_parse!(params,
only: [
:id,
:modified_by,
:languages
])
end
end
Sure, I'll have to add some errors handling on Ember side just to display a confirmation of the update or the errors.
Method json_response is just my custom helper defined as follows in concerns for controllers:
module Response
def json_response(object, status = :ok, opts = {})
response = {json: object, status: status}.merge(opts)
render response
end
end
Hope this helps. You can find more about mode relations in Ember Guide.