search

single-spa / single-spa-examples

Examples of single-spa applications.
https://single-spa.surge.sh
MIT License
359 stars 128 forks source link

Improve Angular 2 app to have more than one route #24

Open joeldenning opened 7 years ago

joeldenning commented 7 years ago

See https://github.com/CanopyTax/single-spa-examples/issues/7#issuecomment-262456119

area73 commented 6 years ago

Hi @joeldenning , I add an Angular 5 demo with routing and angular animation (very simple), but I have a problem with the view that I have no clue in how to solve it.

The problem is that when I try to go from this angular 5 app to another app like angular2 or react. The view is not destroy. This mean that the system loads the new view and underneath there is the angular 5 app. The curiosity of this is that the css files are unloaded but the html on the DOM is not removed and I think that this is something that the framework will have to handle. Am I right?.

I thinks that I'm missing something stupid but I'm not getting it and I don't know what I'm doing wrong.

I create a branch call 'feature/angular5-demo' in my fork: https://github.com/area73/single-spa-examples.git

Just in case you can have a look at it.

Onces I fix this issue if you like I can do a PR to your repo so you can have an example of Angular 5 with routing.

Thanks 👍

joeldenning commented 6 years ago

This seems pretty similar to https://github.com/CanopyTax/single-spa-angular2/pull/3 except it is for the DOM views instead of DOM events.

I'll add this to my to-do list to look into

pauljaxson commented 6 years ago

Hi,

I'm seeing something very similar to this. I have created a demo with a couple of angular 5 apps. As soon as I add animations to one of the apps it starts to not remove that app from the view when it unloads. The apps are dynamically loaded via SystemJS.

I have added an event listener to single-spa:routing-event and the app is shown as NOT_MOUNTED, but the elements are still present in the DOM.

It seems to be the import of BrowserAnimationsModule that is triggering this behaviour.

joeldenning commented 6 years ago

Apologies for the slow response

Hmm, yeah we should look into this. I'm not really an expert in Angular but hopefully in the next week or two could look into this. @pauljaxson have you seen https://github.com/PlaceMe-SAS/single-spa-angular-cli? It lets you use angular-cli plus it doesn't have this issue. It's still a fairly new project but is gaining some momentum. If it turns out successful, I might even start recommending that it be used instead of single-spa-angular2.

For now, though, I think we should look into this issue and see if there's anything we can do. Insights or pull requests definitely accepted.