Ember-Data. Add Child record for many2many & one2many - ember.js

JSFiddle - http://jsfiddle.net/9gA4y/1/
I have following model:
contact => (many2many) => tags
contact => (one2many) => address
Ember Data Model:
App.Contact = DS.Model.extend({
name: attr('string'),
tags: hasMany('App.Tag'),
addresses: hasMany('App.Address')
});
App.Address = DS.Model.extend({
street: attr('string'),
country: attr('string'),
contacts: belongsTo('App.Contact')
})
App.Tag = DS.Model.extend({
name: attr('string'),
contacts: hasMany('App.Contact')
});
I figured out adding New contact record
How do I associate existing, Address to Newly created contact. (one 2 Many)
How do I associate existing, Tags to Newly created contact. (Many 2 Many)
How do I delete associations in a existing contact.

hasMany relationships can be manipulated through addObject, addObjects or removeObject.
contact.get('addresses').pushObject(address);
contact.get('addresses').removeObject(address);
You could also set contact on the address
address.set('contact', contact);
address.set('contact', null);
Also, you note that you should use the singular form for a belongsTo association (contact not contacts):
App.Address = DS.Model.extend({
street: attr('string'),
country: attr('string'),
contact: belongsTo('App.Contact')
});

Try:
var contact = App.Contact.find(1),
address = App.Address.find(1),
tag = App.Tag.find(1);
contact.get('addresses').addObject(address);
contact.get('tags').addObject(tag);
this.get('store').commit(); //saves address and tag to contact
contact.get('tags').removeObject(tag);
this.get('store').commit(); //removes tag from contact

Related

hasMany relationship not updating in the database

When I save a Block (which belongs to a Cube), the belongsTo relationship is saved but the hasMany relationship for the Cube is not. After creating the Block, no PUT request is being sent to the server to update the Cube.
Block Model:
export default DS.Model.extend({
name: DS.attr(),
description: DS.attr(),
cube: DS.belongsTo('cube')
});
Cube Model:
export default DS.Model.extend({
name: DS.attr(),
description: DS.attr(),
blocks: DS.hasMany('block', { async: true })
});
Saving the Block:
var name = this.get('name');
var description = this.get('description');
var cube = this.store.peekRecord('cube', this.model.id);
if (!name) {return;}
this.store.createRecord('block', {
name: name,
description: description,
cube: cube
})
.save()
.then(function() {
this.resetForm();
var name = slugify(this.model.get('name'));
this.transitionToRoute('cubes.show', this.model.get('id'), name);
}
.bind(this));

How do I set up polymorphic relationships using ember-data

So lets say a recipe has several ingredients of differing amounts.
Recipe Model
var Recipe = DS.Model.extend({
name: DS.attr('string'),
ingredients: DS.hasMany('ingredient')
});
Ingredient Model
var Ingredient = DS.Model.extend({
name: DS.attr('string'),
recipes: DS.hasMany('recipe'),
// amount?
});
So the amount of each ingredient would depend on the recipe. However on its own the ingredient will not have an amount.
How would you go about modeling that data? Right now I am using the FixtureAdapter until I finish building the interface.
Using Ember 1.5.1 and Ember-Data 1.0.0-beta.7+canary.b45e23ba.
To answer your first question:
Define the model like so
App.Comment = DS.Model.extend({
message: DS.belongsTo('message', {
polymorphic: true
})
});
And the property needs an additional property propertyType, defining the relationship type
{
"message": 12,
"messageType": "post"
}
https://github.com/emberjs/data/blob/master/TRANSITION.md#polymorphic-relationships
Now to your second question, not sure if polymorphism would be necessary. I might just include a joining record
var RecipeIngredient = DS.Model.extend({
amount: DS.attr(),
ingredient: DS.belongsTo('ingredient')
});
var Recipe = DS.Model.extend({
name: DS.attr('string'),
ingredients: DS.hasMany('recipeIngredient')
});

EmberJS simple ID from related object

is there any way to do some filtering based on the related ID? imagine I have 2 models one is a song model and the other is an album model so obviously the song has album with an id, the json will return the model with
{album: 1}
so if I wanna filter it seems that I can't compare the album id with something like
song.get('album.id') === 1
is there any way to do it so simply?
Thanks
Edit: models
App.Album = DS.Model.extend({
irrelevantstuff: DS.attr(),
songs: DS.hasMany('Song')
})
App.Song = DS.Model.extend({
irrelevantstuff: DS.attr(),
album: DS.belongsTo('Album')
})
I tried both with {async:true} and without, still same problem.
however I noticed that if I run it the first time it gives me undefined to all of the album.id but if I run it the second time I get the ids, now I have everything on the store, so it's not doing an AJAX request either the first or second time.
{"songs": [{"irrelevantstuff":"foo", "album": 1}, {"irrelevantstuff":"bar", "album": 1}]}
{"albums": [{"irrelevantstuff":"album", "songs": [1,2]}]
Relationships should be camelCase
App.Album = DS.Model.extend({
irrelevantstuff: DS.attr(),
songs: DS.hasMany('song', {async: true})
})
App.Song = DS.Model.extend({
irrelevantstuff: DS.attr(),
album: DS.belongsTo('album', {async: true})
})
Since your data for the relationship isn't coming down in the request for the song/album it would be considered async. As such if you want to access it you'll need to use it asynchronous methods, promises.
var songPromise = this.store.find('song', 1);
songPromise.then(function(song){
var albumPromise = song.get('album');
albumPromise.then(function(album){
// the album is available for usage....
if(album.get('id') == 1){
alert('woo hoo');
}
});
});

Ember.js belongsTo is not displayed in view

I'm trying to display a model, with a hasMany relation and each of those relations has a belongsTo relation.
For some reason, Ember doesnt want to display the belongsTo.
Here are my models:
App.City = DS.Model.extend({
city: DS.attr('string')
});
App.Child = DS.Model.extend({
name: DS.attr('string'),
city: DS.belongsTo('city', {async: true})
});
App.Activity = DS.Model.extend({
children: DS.hasMany('child',{async:true}),
name: DS.attr('string')
});
My template looks like this:
Activity name: {{name}}<br />
{{#each child in children}}
Child name: {{child.name}}<br />
Child city name: {{child.city.name}}
{{/each}}
{{child.city.name}} is empty.
I've created a JSFiddle to illustrate the problem here: http://jsfiddle.net/N2xdx/
In your City fixtures you have:
App.City.FIXTURES = [
{
id: 1,
name: 'Aarhus'
}
];
But your App.City doesn't have a name: DS.attr('string') mapping. Update your model to the following, and all will work:
App.City = DS.Model.extend({
name: DS.attr('string'),
city: DS.attr('string')
});
This is a fiddle with this working http://jsfiddle.net/marciojunior/vDaxt/

Same Model for different relation

I want to use my File Model with two other models.
App.File = DS.Model.extend({
filename: DS.attr('string'),
//related:DS.belongsTo('App.Task' and 'App.Comment'),
});
App.Task = DS.Model.extend({
title: DS.attr('string'),
files:DS.hasMany('App.Files'),
});
App.Comment = DS.Model.extend({
comment:DS.attr('string'),
files:DS.hasMany('App.Files'),
});
The database structure has a related_id and related_type column. How can I set this up to work with ember?