3

I've got an issue with controller being called twice in an Ionic app

These are my states

$stateProvider.state('connected', {
        abstract: true,
        url: '/{deviceId}',
        template: '<ion-nav-view/>'
    }).state('connected.presets', {
        abstract: true,
        url: '/presets/{presetType}',
        template: '<ion-nav-view/>'
    }).state('connected.presets.index', {
        cache: false,
        url: '/',
        templateUrl: 'views/presets/index.html',
        controller: 'PresetsIndexController'
    });

I try to navigate between states like this

$state.go('.', {presetType: 'default'});
// OR
$state.go('.', {presetType: 'custom'});

I can't find out why but the PresetsIndexController is being called twice just by updating the presetType param.

I've found someone that seem to have the same issue on this plunker http://plnkr.co/edit/znIa9XU9JsyUDjum2HHx?p=preview. To see the bug, open the javascript console and click on the reload icon, you should see hey twice in the output.

I've also watched the $stateChangeStart event but it seems to be fired once.

I've displayed the stack trace from the controller and the ion-nav-view seems to be the root of the call. So from what I've tried, it seems that ion-nav-view mess up with everything but no idea why nor how to solve this...

EDIT 1

If I move the presetType param to the final state, the controller isn't called twice.

.state('connected.presets', {
        abstract: true,
        url: '/presets',
        template: '<ion-nav-view/>'
    }).state('connected.presets.index', {
        cache: false,
        url: '/{presetType}',
        templateUrl: 'views/presets/index.html',
        controller: 'PresetsIndexController'
    })

But this is not a valid solution for me since I have other children of the connected.presets state that I want to inherit of the presetType.

EDIT 2

It seems that the problem comes from stateParams being changed on the parent state. My (shitty) workaround was to avoid changing stateParams on parent state...

I didn't want to update the ui-router lib since it's tied to my Ionic version. I think other devs had some trouble with ui-router too because Ionic dropped it in v2 and later.

I'm not happy with this workaround at all but hey, it's working.

Elie Faës
  • 3,215
  • 1
  • 25
  • 41
  • are you using any directives/components in the same view that are using the same controller? – alphapilgrim Apr 07 '17 at 15:11
  • Hi thanks for your help. No the controller is unique to this view. I'm not calling with `ng-controller` by the way. Only in this exact state – Elie Faës Apr 07 '17 at 15:18
  • I meant inside of a directive, I've seen a controller be called twice by requiring the controller into a directive. [something-like-this-so-post](http://stackoverflow.com/questions/15672709/how-to-require-a-controller-in-an-angularjs-directive) – alphapilgrim Apr 07 '17 at 15:22
  • This is not the case sadly. The `PresetsIndexController` is only called in this state in my entire project :/ – Elie Faës Apr 07 '17 at 15:25
  • 2
    You have defined controller in ui-routing and you may have written ng-controller in your index.html. try removing ng-controller from index.html – Saurabh Sarathe Apr 07 '17 at 15:32
  • @PeterPan666 please provide your version of `ui-router` and some clear details about which state exactly you are calling with what parameters and how – tanmay Apr 07 '17 at 15:43
  • @tanmay The `$state.go` stuff in my question is in fact the exact state/params I'm calling. Please see the plunker attached it produces the same error (while my code is a little different) – Elie Faës Apr 07 '17 at 15:50
  • @SaurabhSarathe I don't use `ng-controller` anywhere in my app – Elie Faës Apr 07 '17 at 15:51
  • @PeterPan666 what version of `ui-router` llibrary? – tanmay Apr 07 '17 at 16:07
  • @tanmay I think it's v0.2.13, not really sure about that, the one tied to ionic v1.3.1 – Elie Faës Apr 07 '17 at 16:21
  • you should avoid doing state.go with the same state, reload method should only update playlists (data model), it should not call state.go with reload:true – ABOS Apr 07 '17 at 17:27
  • @ABOS as stated, the plunker code is not mine but the bug in it is similar. – Elie Faës Apr 07 '17 at 17:39
  • 2
    @PeterPan666 according to [this](https://github.com/angular-ui/ui-router/issues/1476) issue, it seems `ui-router@0.3.0` or later has the fix. But as you know, ionic `1.3.1` has `v0.2.13` so the only options you are left with is either update ionic version to have `ui-router` version containing fix or you find a workaround to achieve the same thing differently – tanmay Apr 07 '17 at 18:19
  • @tanmay thanks for pointing out the issue, thought it was related to ionic it self :/ I'll take a deeper look at it and hope I will find a workaround. – Elie Faës Apr 07 '17 at 20:08
  • I've updated my question, hope it'll help other devs, or someone could find a better solution, some day, maybe. Thank you all for your time – Elie Faës Apr 11 '17 at 09:56

0 Answers0