4

I want to use ember with a widget approach (component in isolation), setting rootElement for
Ember Applications, each one with its own router and store (if necessary).

I did an unsuccessful attempt in http://jsfiddle.net/4xWep/2/ Maybe there is an interference issue between router instances. It has sense this widget approach, with different Applications and Routers?

App1 = Ember.Application.create({
  rootElement: '#app1'
});

App1.ApplicationController = Ember.Controller.extend();
App1.ApplicationView = Ember.View.extend({
  templateName: 'app1-view'
})

App1.Router = Ember.Router.extend({...})

var App2 = Ember.Application.create({
    rootElement: '#app2'
});

App2.ApplicationController = Ember.Controller.extend();
App2.ApplicationView = Ember.View.extend({
  templateName: 'app2-view'
})

App2.Router = Ember.Router.extend({...})
sly7_7
  • 11,961
  • 3
  • 40
  • 54
acs
  • 123
  • 6

1 Answers1

2

The issue is your two application's routers conflict using the location.hash to serialize their state.

You cannot have two applications relying on the hash routing persistence strategy in the same page.

I would even say, it seems to me that what you are trying to achieve are not classical 'widgets', as they will have complex state (as indicated by the will of routing inside each)... Certainly you should dig a little more your architecture. Maybe what you need is not two applications, but rather widgets, or on the other hand, several applications, but not rendered directly in the same document.

Maybe this (related?) question will help.

Community
  • 1
  • 1
Mike Aski
  • 9,180
  • 4
  • 46
  • 63
  • I was thinking in components with weak relations between them. Something like Portlets or pluggable user interface software components. Often, some interrelated applications deployed in distributed environments, share some user interface component. It would be useful to add these components as 'Ember.Application'. While I understand that with this approach you have to fragment the document, because you cannot nest Applications in the same page. – acs Oct 17 '12 at 17:19
  • @acs Give an example for a App/widget(s) scenario that you envision, it will be easier to help. – sabithpocker Oct 17 '12 at 17:40
  • Here is a similar question @MikeAski answered a while back http://stackoverflow.com/questions/11391333/emberjs-develop-a-component-in-isolation-with-its-own-routing-states-which-can – sabithpocker Oct 17 '12 at 17:45
  • @sabithpocker; Imagine an interface component to search for users in a system. I can develop an Ember.Application "SearchForUserApp" with its own router and storage. If someone needs to use a component to search users and shares the data model that supports the "SearchForUserApp" component, could incorporate it into their application. It would be possible to compose a single page by adding multiple Ember.Application. – acs Oct 17 '12 at 18:29
  • Thanks for your answers. I see that options to achieve modularity with EMBER are many, and it seems that to have several Ember.Application on the same page, is not the best. – acs Oct 18 '12 at 10:17