Different Ember Routes or Displaying Two Complex Views in their own context

问题

I have an app with different related concerns. I have a list of items on the left that affect some of the items on the right (think Github Issues), but here's a mockup

All fine, I click Item One and something happens on the right. However, the list on the left has its own routing requirements, it's a resource of items with nested routes. For example when we click on Create New Item we display a new form inline (see bottom left corner)

When I do that it, even if it's on a different outlet, it overrides what is currently rendered in other outlets. In this case the products on the right.

It would be ideal if we could just have different routers for different sections. I know I could just call render and create a new view/controller, but that would require me to handle my own states (am I creating a new item, editing it, looking at the index, etc).

I'm currently looking into query-params as an option.

Any ideas?

回答1:

I tried many ways to solve this and ended up having a route that encompasses all the various routes that need to coexist render the rest of the parent routes with {{render}}, and making those routes' renderTemplate hook a NOOP (you have to do this specifically, or you will get assertion errors that you are using the singleton form of render twice).

However you don't have to manage your own state -- you can still use nested routes, and their model hooks, and since you are using the singleton form of {{render}} things will still automagically render into their correct spots. To say that another way: if you are using the singleton form of {{render}}, routes can set that controllers model, via the model hook if the route has the same name as the controller, or in either the model or setupController hook of another route using controllerFor.

You can also render into named outlets in the renderTemplate hooks, but I eventually abandoned that approach because I still had problems with disconnectOutlet getting called on things I didn't want disconnected.

Discussion on some outstanding issues indicate that there may eventually be a way to control whether/when routes get torn down and their outlets disconnected, but only when a way to do it has been worked out that won't increase the chance of memory leaks for people doing things the ordinary way.

回答2:

It's possible to register a different router and inject this into controllers. From ember's source code:

/**
@private

This creates a container with the default Ember naming conventions.
It also configures the container:
....
* all controllers receive the router as their `target` and `controllers`
  properties
*/

buildContainer: function(namespace) {
    var container = new Ember.Container();

    // some code removed for brevity... 
    container.register('controller:basic', Ember.Controller, { instantiate: false });
    container.register('controller:object', Ember.ObjectController, { instantiate: false });
    container.register('controller:array', Ember.ArrayController, { instantiate: false });
    container.register('route:basic', Ember.Route, { instantiate: false });

    container.register('router:main',  Ember.Router);

    container.injection('controller', 'target', 'router:main');
    container.injection('controller', 'namespace', 'application:main');

    container.injection('route', 'router', 'router:main');

    return container;
}

A second router could be created, registered with the container and injected into certain controllers:

    App.Router = Ember.Router.extend();
    App.Router.map function () {...}

Then to register

    container.register('router:secondary',  App.Router);
    container.injection('controller:list', 'target', 'router.secondary');

来源：https://stackoverflow.com/questions/20111301/different-ember-routes-or-displaying-two-complex-views-in-their-own-context

标签

ember.js