Need help with ionic and angular-permissions


I’m new to angular and ionic, but I was trying to build app using :

I recently modification with side menu, adding angular-translate to get multi language and use deployd as backend.

Now, I need to make something like authentication check before view is displayed.
I was try using angular-permission to manage roles, but I’m currently facing a problem.

the app default route is /#/app/dashboard, but if not logged-in it will redirected to /login.

The problem is:
Assume when I running project with ionic serve is same as opening app and if not logged-in the app will land at login screen (because angular-permissions).
And when login and validated, the LoginCtrl should route to /#/app/dashboard by $state.go(‘app.dashboard’) but It’s always won’t move (if it was redirected by angular-permission before).

Here is the code:

in routes.js:

        .state('login', {
            url: '/login',
            templateUrl: 'views/login.html',
            controller: 'LoginCtrl'
        .state('app', {
            url: '/app',
            abstract: true,
            templateUrl: 'views/main.html',
            controller: 'AppCtrl',
            data: {
                permissions: {
                    except: ['anonymous'],
                    redirectTo: 'login'
        .state('app.dashboard', {
            url: '/dashboard',
            views: {
                'mainContent': {
                    templateUrl: 'views/dashboard.html'


in config.js:


    Permission.defineRole('anonymous', function (stateParams) {
        // If the returned value is *truthy* then the user has the role, otherwise they don't
        if (!UserService.isLoggedIn()) {
            return true; // Is anonymous
        return false;


in LoginCtrl:

    $scope.creds = {
        username: '',
        password: ''

    $scope.login = function(creds) {
        $timeout(function () {
            dpd.users.login(creds, function(user, err) {
                if(err) {
                      title: $translate.instant('global.error'),
                      template: (err.status === 401 ? $translate.instant('auth.invalid_login') : $translate.instant('auth.error_unknown'))
                } else {
           (profile, error) {
                        if (!error) {
                    $state.go('app.dashboard'); // this is wont go to /app/dashboard if was redirected by angular-permission
        }, 100); 

The LoginCtrl will not redirecting to /app/dashboard if redirected by angular-permission, but if manually go /#/app/dashboard after login, then logout and then login again it will redirected to /app/dashboard.

I’m also was trying to change $state.go with $location.path, but still same.

Is there solution for this problem? or any alternative methods to get roles with angular?
I’m also trying with simple listening $stateChangeStart, but it almost same like using angular-permission.

Thank you before,
Sorry for my bad English language :blush: