How to unbind Elm App

Hi all,

We are in a process of migrating our legacy Angular 1.x SPA app to Elm where we still have some parts of the app in Angular and still using its router plus we have couple of Elm apps which are embedded to DOM nodes when route is changed (to e.g. #/moduleX ).

What I noticed is that if I navigate away to other route (with Angular components) and the original DOM node where the Elm app was embedded was destroyed - I still see subscriptions from the app firing HTTP requests.

I’m not sure if there is anything particular that needs to be done to correctly unload/unbind application (e.g. in Angular $onDestroy hook) but the return value from embed() function is just an object with ports. Just FYI we are embedding Navigation.programWithFlags apps which are subscribing to location changes.

Any help, suggestion would be very appreciated :slight_smile:



I would also like to know if there is a solution in 0.19

In 0.18 the best we could do is stop the subscriptions…

There have been some previous discussions here about that. Search for “unmount”. This one has a suggested technique. I think it’s probably 0.18, haven’t re-read it in detail to check. But may give you ideas.


Thanks Brian! That helped a lot.

1 Like

It’s still the same for 0.19. I’ve prepared a package to automate this work but have not published yet. It seems it’s not possible to publish modules with ports for 0.19. Hope I can find time to publish the package soon.


Sorry for late reply. I think it’s a bit more complicated (not even sure if it can be done) when you use Navigation.programWithFlags as the subscription to URL changes is added (via Sub.Batch) in programWithFlags function. I don’t think it’s possible to ‘disable’ that subscription. Or do you see any option here ?

Do you have a code example? I think (but could be wrong) that you can also just swap out that subscription for a Sub.none variant.

Well, our Elm app is initiated via Navigation.programWithFlags as below:

main : Program AppFlags Model Msg
main =
    Navigation.programWithFlags UrlChanged
        { init = init
        , view = view
        , update = update
        , subscriptions = subscriptions

But Navigation.programWithFlags is adding it’s own subscription to the list of our app subscriptions so the program is still receiving URL updates even if our subscriptions = Sub.none. The only workaround that I could come up with so far is just to ignore the UrlChanged message when Unmount msg is sent via the port but the subscription is still there so it’s not ideal…

Assuming you are using Elm 0.18’s Navigation.programWithFlags: You can see that the subscriptions function takes your model as input, which lets you switch between whatever subscriptions you have and Sub.none. Or am I misinterpreting your question?

Side note: This language is called ‘Elm’ (as in the tree) rather than ‘ELM’ (it’s not an abbreviation).

The issue is that you’re still receiving URL updates even if subscriptions = Sub.none because Navigation.programWithFlags subscribes to it (not the application code itself).

Thanks for the Side note :slight_smile:

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.