State Change not firing but ui.router works otherwise

Viewed 557

I'm using angularjs: 1.6.5 and ui-router: 1.0.3

Main html:

<div ng-app="MusicApp" ng-controller="AppCtrl">

    <div ng-include="plugins_url + 'templates/sideMenu.html'"></div>

    <md-content ng-controller="playlistController">

        <div ng-include="plugins_url + 'templates/header.html'"></div>

        <div class="all_content" >
            <div ng-show="!isHome">
                <div ui-view id="other_views" ></div>
            </div>

            <div ng-include="plugins_url + 'templates/main.html'" ng-show="isHome"></div>
        </div>

    </md-content>
[etc]

Content from sideMenu.html:

<li><a ui-sref="charter">Home</a></li>
<li><a ui-sref="charter.test">Test</a></li>

My issue is that basically none of the stateChange provides work, and I've tried: $stateChangeError, $stateChangeCancel, $stateChangeStart, $stateChangeSuccess, like so:

$rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState) {
     console.log('called')
})

but it's never called... Tried to put it in .config, in every controller, tried it with $scope and/or $rootScope, but nada.

The weird thing is that I see this as warning in my console:

angular.min.js?1507208413&ver=4.8.2:123 $route service is not available. Make sure you have included ng-route in your application dependencies.

So it somehow doesn't recognize ui.router, which of course is loaded as a file, and inserted to the dependencies as 'ui.router'. The weirdest part is, that ui-sref IS working, as you can see in sideMenu.html...

Is it possible that there is a compatibility issue... somewhere?

Appreciate any help!

EDIT: I have tried with ui.router 0.4.3 and older version, but it won't even start the app...

1 Answers
Related