Ember.js based dashboard

Question

I'm developing an application using ember.js and a rest API written with spring MVC. I have to create a dashboard with several widget on it. Every widget as its own behavior and will call different API method. I was thinking to have one controller subclass for each kind of widget. Then will instantiate them and will add ther views to a Container view. However ember will create a instance for each controller automatically, so is it a good path to follow? Any suggestion fom the ember.js community?

Thank you for the help.

Answer 1

Your ideas sound pretty good.

There are certainly many ways to structure this. I would perhaps suggest making a DashboardView and DashboardController, and in its template, have several outlets, one for each widget "slot":

{{outlet topWidgetView}}
{{outlet leftWidgetView}}
...

Then in the router, in the dashboard route's connectOutlets method, connect the widgets after you've instantiated the dashboard:

router.get('applicationController').connectOutlet('dashboard');

router.get('dashboardController').connectOutlet({
  outletName: 'topWidgetView',
  name: 'fooWidget'
});
router.get('dashboardController').connectOutlet({
  outletName: 'leftWidgetView',
  name: 'barWidget'
});

Answer 2

Rather than a slot for each widget, I would rather have a slot by widget area (column, ...), which would be a ContainerView, into which one I would dynamically add widgets views, according to user's settings.