Error: state.$$permissionState is not a function

[spyhunter88]

Hi, I face this issue when just inject to angular module. I've search but no found anywhere :(.
I include js like that:

  <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
  <script src="bower_components/angular-permission/dist/angular-permission.js"></script>
  <script src="bower_components/angular-permission/dist/angular-permission-ui.js"></script>

Full error log:

Error: state.$$permissionState is not a function
StatePermissionMap@http://localhost:8080/bower_components/angular-permission/dist/angular-permission-ui.js:455:27
run/<@http://localhost:8080/bower_components/angular-permission/dist/angular-permission-ui.js:70:36
$RootScopeProvider/this.$get</Scope.prototype.$broadcast@http://localhost:8080/bower_components/angular/angular.js:18005:15
transitionTo@http://localhost:8080/bower_components/angular-ui-router/release/angular-ui-router.js:3273:13
registerState/<@http://localhost:8080/bower_components/angular-ui-router/release/angular-ui-router.js:2384:11
invoke@http://localhost:8080/bower_components/angular/angular.js:4718:16
handleIfMatch@http://localhost:8080/bower_components/angular-ui-router/release/angular-ui-router.js:1868:18
$UrlRouterProvider/this.when/strategies.matcher/<@http://localhost:8080/bower_components/angular-ui-router/release/angular-ui-router.js:1925:18
check@http://localhost:8080/bower_components/angular-ui-router/release/angular-ui-router.js:2041:23
update@http://localhost:8080/bower_components/angular-ui-router/release/angular-ui-router.js:2050:13
$RootScopeProvider/this.$get</Scope.prototype.$broadcast@http://localhost:8080/bower_components/angular/angular.js:18005:15
afterLocationChange@http://localhost:8080/bower_components/angular/angular.js:13764:7
$locationWatch/<@http://localhost:8080/bower_components/angular/angular.js:13750:13
$RootScopeProvider/this.$get</Scope.prototype.$eval@http://localhost:8080/bower_components/angular/angular.js:17682:16
$RootScopeProvider/this.$get</Scope.prototype.$digest@http://localhost:8080/bower_components/angular/angular.js:17495:15
$RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost:8080/bower_components/angular/angular.js:17790:13
bootstrapApply@http://localhost:8080/bower_components/angular/angular.js:1761:9
invoke@http://localhost:8080/bower_components/angular/angular.js:4718:16
bootstrap/doBootstrap@http://localhost:8080/bower_components/angular/angular.js:1759:5
bootstrap@http://localhost:8080/bower_components/angular/angular.js:1779:12
angularInit@http://localhost:8080/bower_components/angular/angular.js:1664:5
@http://localhost:8080/bower_components/angular/angular.js:31763:5
trigger@http://localhost:8080/bower_components/angular/angular.js:3207:7
defaultHandlerWrapper@http://localhost:8080/bower_components/angular/angular.js:3497:3
createEventHandler/eventHandler@http://localhost:8080/bower_components/angular/angular.js:3485:9
EventListener.handleEvent*addEventListenerFn@http://localhost:8080/bower_components/angular/angular.js:2796:7
jqLiteOn/addHandler@http://localhost:8080/bower_components/angular/angular.js:3547:11
jqLiteOn@http://localhost:8080/bower_components/angular/angular.js:3560:9
JQLite.prototype[name]@http://localhost:8080/bower_components/angular/angular.js:3728:17
JQLite.prototype.ready@http://localhost:8080/bower_components/angular/angular.js:3214:7
@http://localhost:8080/bower_components/angular/angular.js:31762:3
@http://localhost:8080/bower_components/angular/angular.js:6:2

I use angular 1.5.8.

[masterspambot]

And what is the version of the rest of the components angular-permission and ui-router?

[spyhunter88]

Sorry for missing information, I use both latest version: ui-router (0.3.1) and angular-permission (4.0.3).

[masterspambot]

Did you injected dependencies correctly?

https://github.com/Narzerus/angular-permission/wiki/Installation-guide-for-ui-router

[spyhunter88]

Sorry, I go out for holiday on a few day. I use both latest version with ui-router 0.3.1 and angular-permission 4.0.3. It throw error when I go to a state.
But my state comes without data.permissions defined, is this ok? I will test in next few day.

[masterspambot]

No it's not.... Definitely not.

[masterspambot]

Source of your problem is that ui-router is not loaded before ui-permission and state.$$permissionState is function decorating ui-router's $state object that is not available at the moment of initialization. Please ensure your libs load in correct order.

[spyhunter88]

I load in right order. My full module define.

  'ui.router',
  'myApp.auth',
  'myApp.serverRequest',
  'myApp.version',
  'satellizer',
  'permission',
  'permission.ui'

I need some time to find problem.

[cmolina]

Any news about this issue? I have a similar error when running my tests.

[compwright]

+1 - can we get this re-opened and looked at?

[manisto]

+1 here as well. I'm loading the scripts in the right order (ui-router, permission, permission-ui), and adding the dependencies to the module in the right order ('ui.router', 'permission', 'permission.ui'), yet I still get this error. UI Router is 0.3.2 and permission is 5.1.0.

[masterspambot]

Ill look at it ASAP.

[kunzimariano]

In my case it only fails when deploying into production (which runs some extra steps like uglify). The temporal fix was to avoid the min.js scripts in favor of the ones that aren't minified.

[victorjspinto]

I had the same problem and i found a solution. @spyhunter88 seeing your declaration order, you must declare permission and permission-ui after ui.route but not before your module (where you declare states)

Try this order

  'ui.router',
  'permission',
  'permission.ui',
  'myApp.auth',
  'myApp.serverRequest',
  'myApp.version',
  'satellizer'

Maybe the same applies to other facing the same issue :)

PS: My scenario

    "angular-permission": "^5.1.0",
    "angular-ui-router": "^0.3.2",

[masterspambot]

Related to #365

[phuongduy2010]

I have followed the above instruction and #365 issue, but state.$$permissionState is not a function still happen :(

[Jakobovski]

This issue should not be closed

[Jakobovski]

I was able to solve the issue on my end by using the non-minified version of angular permission.

[vsagar9944]

@victorjspinto your solution perfectly solved my problem, Thanks.
Injecting permission and permission.ui just after ui.router and before any custom module which defining states solved this issue.