Implement Routing With EmberFire? - ember.js

Question

However I find myself still unclear on the prospect of getting some of the functionality as Model. Right now I'm trying to utilize the new emberFire library, which provides some base Object types for interacting with the Firebase service.
I'm able to create new objects and arrays of objects, however I'm unable to get Routes setup properly.
Am I able to extend my base App.Model as one of the EmberFire objects in order to utilize the more standard approaches to retrieving and manipulating data?
Edit
When I've tried using the suggestion in Answer 2, I've gotten this error:
Uncaught TypeError: Cannot read property 'id' of undefined
So I tried adding in:
App.Post = EmberFire.Object.extend({
id: null,
body: null
});
To perhaps define the Object, however I feel I'm going about that the wrong way as well?
Edit 2
Here's my current stuff:
App = Ember.Application.create();
App.Router.map(function() {
this.resource('post', { path: '/:post_id' }, function() {
this.route('edit');
});
});
App.Post = EmberFire.Object.extend({
id: null,
title: null
});
As I mentioned above, I've tried defining my object as both an EmberFire.Object and EmberFire.Array, and attempted plugging App.Post.create in my Route.
App.IndexRoute = Ember.Route.extend({
model: function() {
return EmberFire.Array.create({
ref: new Firebase("https://embertest2.firebaseio.com/posts/")
});
}
});
App.PostRoute = Ember.Router.extend({
model: function(params) {
return EmberFire.Object.create({
ref: new Firebase("https://embertest2.firebaseio.com/posts/" + params.post_id)
});
}
});
I'm also wondering if perhaps I shouldn't be using the EmberFire.Array in my IndexRoute to generate essentially the list of links for each post.
App.IndexController = Ember.ArrayController.extend({
title: "",
actions: {
addPost: function() {
this.pushObject(this.get('title'));
}
}
});
My aim currently is to create each Post record, have it populate on the list, have links to each Post, and the ability to edit each Post record on the Post page.
Here's the current error I've been getting:
Uncaught TypeError: Cannot read property 'id' of undefined ember.js:30274
serialize ember.js:30274
paramsForHandler ember.js:29636
Router.generate ember.js:29457
Ember.Router.Ember.Object.extend.generate ember.js:30524
(anonymous function) ember.js:32438
ComputedPropertyPrototype.get ember.js:4446
get ember.js:1937
(anonymous function) ember.js:20674
Ember.EnumerableUtils.forEach ember.js:1805
Ember.View.Ember.CoreView.extend._applyAttributeBindings ember.js:20655
Ember.View.Ember.CoreView.extend.applyAttributesToBuffer ember.js:21128
Ember.View.Ember.CoreView.extend.beforeRender ember.js:21107
Ember.CoreView.Ember.Object.extend._renderToBuffer ember.js:19458
Ember.View.Ember.CoreView.extend._renderToBuffer ember.js:21096
superWrapper ember.js:1239
(anonymous function) ember.js:19440
Ember.Instrumentation.instrument ember.js:1683
Ember.CoreView.Ember.Object.extend.renderToBuffer ember.js:19439
Ember.merge.appendChild ember.js:21941
Ember.View.Ember.CoreView.extend.appendChild ember.js:21291
EmberHandlebars.ViewHelper.Ember.Object.create.helper ember.js:25821
(anonymous function) ember.js:25999
(anonymous function) ember.js:32685
program1
program handlebars-1.0.0.js:2251
Ember.View.Ember.CoreView.extend.render ember.js:20522
Ember.CoreView.Ember.Object.extend._renderToBuffer ember.js:19459
Ember.View.Ember.CoreView.extend._renderToBuffer ember.js:21096
superWrapper ember.js:1239
(anonymous function) ember.js:19440
Ember.Instrumentation.instrument ember.js:1683
Ember.CoreView.Ember.Object.extend.renderToBuffer ember.js:19439
Ember.merge.renderToBufferIfNeeded ember.js:21887
Ember.View.Ember.CoreView.extend.renderToBufferIfNeeded ember.js:21103
Ember.merge.ensureChildrenAreInDOM ember.js:22563
Ember.ContainerView.Ember.View.extend._ensureChildrenAreInDOM ember.js:22528
DeferredActionQueues.flush ember.js:5484
Backburner.end ember.js:5568
(anonymous function) ember.js:5822
I figure I'm doing something silly here, and will continue to muck about until I stumble over what I did incorrectly.

Answer 1

The README on the emberFire page that you linked details how to create your custom objects in your Route. If you're talking about the Router (which is different than a Route), I don't think it should be any different than normal (with Ember Data). If you're having trouble with it you should post the code that you've tried to use and any errors that you're getting. If you can post a JSBin illustrating the problem it would be even better.

Answer 2

You can attach EmberFire.Object to a specific URL that is associated with the post. You'll need the post_id to do that:
App.PostRoute = Ember.Router.extend({
model: function(params) {
return EmberFire.Object.create({
ref: new Firebase("https://embertest2.firebaseio.com/posts/" + params.post_id)
});
}
});