Is resource nesting the only way to enable multiple dynamic segments?

Question

This seems to suggest that the answer is yes:

From Ember Pre1 to Pre4: Multiple dynamic segments per route? Update: What is the allowed syntax for dynamic segments?

... but I just want to confirm.

In my case, as a learning exercise, I'm building a calendar in Ember, with monthly displays. I need to be able to link from a given month to the previous month, and to the next month.

So I'd like to be able to

{{ linkTo calendar_month year month }}

and

this.transitionTo('calendarMonth', year, month)

Wondering if this is feasible without using nested resources. I can get it working with something like:

App.Router.map(function() {
  this.resource("year", { path: "calendar/:year" }, function() {
    this.resource("calendar_month", { path: "/:month" }, function() {
      this.route('index');
    });
  });
});

... but this involves introducing a Year object which might not really need to exist from a modeling perspective, just so I can use its id in linkTo

I'd prefer to set up a route with two parameters/dynamic segments:

App.Router.map(function() {
  this.route('calendar_month', { path: 'calendar/:year/:month'});
});

But am I correct that this is not possible? I just want to make sure I'm doing this the cleanest, emberiest way possible.

Put another way:

I understand this notion that "If your user interface is nested, then your routes should be nested", but, if my url is nested, this does not necessarily imply that my interface will be nested as well. So I'm wondering: if my url is nested, is it always best practice to build corresponding nested models?

Any guidance / clarification much appreciated.

thanks,

Socha

Answer 1

As i am the asker of the question you referenced, i am answering here. I have already updated my question that this is perfectly possible.

Your approach should work:

App.Router.map(function() {
  this.route('calendar_month', { path: 'calendar/:year/:month'});
});

All you have to add are the serialize and model hook implementations:

serialize: function(context){
    // i assume that you wrap year and month in an Object (maybe App.YearAndMonthObject)
    var ret = {
        year : context.get("year"),
        month : context.get("month")
    };
    return ret;
},
model : function(params){
    //somehow create your object from the params
    var model = App.YearAndMonthObject.create({
        year : params.year,
        month : params.month
    });
    return model;
}

This would also need a modification on your use of linkTo:

{{ linkTo calendar_month year month }}

...instead you would just use:

{{ linkTo calendar_month yearAndMonth }}

I think this an emberish way to deal with this.

Summary: So what are routes all about?

They are used to separate concerns. And in your case it seems so, that year and month are part of the same concern (=route). Therefore they should be wrapped together in an new Ember Object and your route (CalendarMonthRoute) should deal with this new object (maybe YearAndMonthObject or CalendarMonthObject?).

Diley

would the serialize() and model() methods live inside calendar_month.js in this example? – Bookstand