# Ember + Nested RESTful-ish API + Pain

**URL:** <https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651>\
**Category:** Uncategorized\
**Created:** [March 28, 2014, 8:30am UTC](https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651 "2014-03-28T08:30:03Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![clem](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/clem/32/15364_2.png) [@clem](https://discuss.emberjs.com/u/clem)\
**Post date:** [March 28, 2014, 8:30am UTC](https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651/1 "2014-03-28T08:30:03Z")

</div>

I’m attempting to do something that, to me, has been simple with every other client-side framework I’ve worked with in the past. So far, it seems like Ember is incapable of handling this case without a massive amount of extra work. Here’s a general outline of the problem:

My API looks something like this (but with different model names):

```auto
/users
/users/:user_id
/users/:user_id/widgets
/users/:user_id/widgets/:widget_id

```

This is extremely common, extremely usable API design.

Pretty straightforward. In my Ember app, I’d like to define a route (probably just `/users/:user_id`) that displays both information about the user (that is returned from the API at `/users/:user_id`), as well as information about each widget (returned from the API at `/users/:user_id/widgets`). Ideally, my page doesn’t render until all of this data is loaded, and it should load very quickly because I’d ideally be making both required API calls simultaneously.

My templates, logically, would look something like this:

```handlebars
<h1>User {{name}}</h1>

<h2>Widgets</h2>

<ul>
  {{#each widget in widgets}}
    <li>{{widget.name}}</li>
  {{/each}}
</ul>

```

In fact if I had many other nested resources just under the `/users/:user_id` level, I should be able to list all sorts of data about those items without taking a significant performance hit, because I can make all of the API requests simultaneously (because I know the user ID).

From what I’m reading, ember-data does not have support for nested resources, so that’s not a possibility (it’s not a weird Rails API where I can just call `/widgets?user_id=:user_id`). Looking beyond that, it seems like every time a question like this comes up, a completely different and typically convoluted solution is proposed. The rest of Ember looks awesome, but the seemingly giant complexity of this simple task in Ember is a blocker to me adopting the framework, right now, especially when other frameworks like Angular, for example, have mature http frameworks like [restangular](https://github.com/mgonto/restangular) that understand how RESTful APIs tend to be written, and already have support for niceties like conditional GETs.

Any suggestions or discussion around this would be greatly appreciated. Is there already a mature library that works with Ember that supports this?

**EDIT**

I spent another few hours working on this. I think that the way that `Ember.RSVP` works and the way that `Ember.Route#model` waits for promises should _really_ be exposed much more in documentation and general discussion around ember. Once I realized I could just construct a hash of `$.getJSON` calls with `Ember.RSVP::hash`, a lot of my problems seem much easier to deal with.

---

<div class="post-metadata">

**Author:** ![opsb](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/opsb/32/9475_2.png) [@opsb](https://discuss.emberjs.com/u/opsb)\
**Post date:** [March 28, 2014, 11:46pm UTC](https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651/2 "2014-03-28T23:46:21Z")

</div>

[It looks like](http://stackoverflow.com/questions/22688602/ember-data-asynchronous-dependencies-with-links-issue) you can use relative paths when you use “links” in the json from the server.

```
"person": {
  "name": "John Smith",
  "links": {
    "children": "./children",
    "jobs": "./jobs"
  }
} 

```

If you can’t/won’t change the format of the json from the server you could always extend the RestAdapter to modify the format of the json when it arrives at the client.

---

<div class="post-metadata">

**Author:** ![dougrohde](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/dougrohde/32/15638_2.png) [@dougrohde](https://discuss.emberjs.com/u/dougrohde)\
**Post date:** [March 30, 2014, 2:27pm UTC](https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651/3 "2014-03-30T14:27:24Z")

</div>

@clem I am totally with you. I’ve been experiencing the same pain. The continuing inability of the Ember team to solve this problem seriously makes me question whether Ember is a viable framework. Client side frameworks should NEVER impose their philosophies on the resources that provide their data.

---

<div class="post-metadata">

**Author:** ![dougrohde](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/dougrohde/32/15638_2.png) [@dougrohde](https://discuss.emberjs.com/u/dougrohde)\
**Post date:** [March 30, 2014, 8:35pm UTC](https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651/4 "2014-03-30T20:35:32Z")

</div>

@clem Do you have an example of how you handled that? I would be very interested to see it.

---

<div class="post-metadata">

**Author:** ![clem](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/clem/32/15364_2.png) [@clem](https://discuss.emberjs.com/u/clem)\
**Post date:** [March 30, 2014, 10:29pm UTC](https://discuss.emberjs.com/t/ember-nested-restful-ish-api-pain/4651/5 "2014-03-30T22:29:44Z")

</div>

@dougrohde Briefly, I’m just using a general `Model` class that wraps `$.getJSON` and some caching behavior. `User` and `Widget` extend this class, but there’s not has-many-belongs-to relationship set up, because I don’t actually need it. If I needed both user and widgets in a route, I’d do something like this, now:

```javascript
UserIndexRoute = Ember.Route.extend({
  model: function(params) {
    var user = User.find(params.id);

    return Ember.RSVP.hash({
      user : user,
      widgets: Widget.all(user)
    });
  }
});

```

My `Model` that `Widget` and `User` extend is smart enough to turn `Widget.all(user)` into a `$.getJSON` to `/users/1/widgets` (given a user with ID 1).

Honestly, now that I’ve decided not to consider ember-data and build my own solution, I don’t feel quite as worried. It wouldn’t take much to implement something that looked like this:

```javascript
UserIndexRoute = Ember.Route.extend({
  model: function(params) {
    return User.find(params.id).with('widgets');
  }
});

```

If I wanted both user information and the user’s widget list.
