Routing with Multiple Instances of an AngularJS Application

[Trevor Burkholder]

I have two instances of the same application running on a single page, by using angular.bootstrap, but routing in one application triggers a route change in both applications. I've tried this with ui.router and Angular's built-in routing.

Is there any way to get routing to be restricted within each application?

[Eric Eslinger]

Is there a good reason to have two instances of the same application running on the same page? If you control the application, it may make life a ton easier to have it be one application with multiple UI-views.

e

On Tue Nov 25 2014 at 8:34:05 AM Trevor Burkholder <tbu...@gmail.com> wrote:

I have two instances of the same application running on a single page, by using angular.bootstrap, but routing in one application triggers a route change in both applications. I've tried this with ui.router and Angular's built-in routing.

Is there any way to get routing to be restricted within each application?

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

[Trevor Burkholder]

Normally I would say no but I'm working with Liferay in this case - an enterprise portal - so the Angular applications will live inside portlets which can be made to be instancable.

So, a use case would be:

A client wants a charts portlet where the data source is configurable - something that is possible through portlet configuration within the Portal/CMS UI - but for all intents and purposes the application in each instance would be the same app, but they might need to navigate independently. The client could drag their chart portlets, each containing a copy of the same Angular chart application, onto a page and then they would all operate independently.

This all isn't necessary but it would be nice if it were possible. I know you can have two copies of the same app running on a page, so it would, or should, follow that it is also possible for them to navigate independently. 

[Raul Vieira]

i don’t think there is away to localize url based routing per ng-app as they both are interested in window events .  One solution could be to use ui-router’s state based routing instead of the urls.  The caveat in this case is losing bookmark-ability.

Raul

[Trevor Burkholder]

I did try ui-router's state based routing but nothing would happen when clicking a link once I removed the url param from the $stateProvider. I must have been doing something wrong; it was my first time working with ui-router.

[Raul Vieira]

I don’t know if you’ve seen this: https://egghead.io/lessons/angularjs-ui-router-activating-states

Raul

[Trevor Burkholder]

It looks like that video either got taken down or is inaccessible. 

Anyway, I got UI router to work and handle my routing for me, but the route still changes for both apps when a link is clicked in either app.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/c477A_RYuDI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.