Angular JS: Inject service within app.js

Question

I want the users not to go to certain pages at least they've logged in before. I'm currently using this:

app.run(function ($rootScope, $route, $location)
{
    var restrictedPages = 
            [   
                '/Survey/', '/Survey/Detalle', '/Survey/Accepted', '/Account/Profile',
                '/Auction/Detail', '/Survey/Accepted'
            ];

    $rootScope.$on('$locationChangeStart', function (ev, next, current)
    {
        var nextPath = $location.path();
        var nextRoute = $route.routes[nextPath];

        if(restrictedPages.indexOf(nextPath) !== -1)
        {
            $location.path('/home');
        }
    });
});

My problem here is that I want to inject inside of this piece of code my AccountService. How can I achieve this? Because the loading-order is the following

app.js (the code presented is inside here)
homeService.js
accountService.js

I truly believe this is not the right way to go but it seems so simple and the only thing I'm missing is the account service injection.

What do you mean by "injection"? A service can be injected into another service. But a "piece of code" can't be injected. — JB Nizet
– JB Nizet, Commented Mar 22, 2016 at 22:17
Are you saying you want this run block to instantiate and reference your AccountService? — Daniel Nalbach
– Daniel Nalbach, Commented Mar 22, 2016 at 22:31

Mickaël VILLERS · Accepted Answer · 2016-03-22 23:01:49Z

2

Consider this module, which includes a accountService that uses implicit DI:

angular.module('myApp', [])
.factory('accountService', function($rootScope) {
  // $rootScope is implicitly injected
})
.run(['$rootScope', '$route', '$location', 'accountService', function ($rootScope, $route, $location, accountService)
{
    var restrictedPages = 
            [   
                '/Survey/', '/Survey/Detalle', '/Survey/Accepted', '/Account/Profile',
                '/Auction/Detail', '/Survey/Accepted'
            ];

    $rootScope.$on('$locationChangeStart', function (ev, next, current)
    {
        var nextPath = $location.path();
        var nextRoute = $route.routes[nextPath];

        if(restrictedPages.indexOf(nextPath) !== -1 && !accountService.isLoggedIn())
        {
            $location.path('/home');
        }
    });
}]);

if you want more documentation: https://docs.angularjs.org/guide/di

edited Mar 22, 2016 at 23:01

answered Mar 22, 2016 at 22:44

Mickaël VILLERS

1478 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Luis Deras Over a year ago

I did not know you could inject a service within this. But how this get to work when the account service hasn't been loaded yet? I mean the actual javascript file

Mickaël VILLERS Over a year ago

you can use docs.angularjs.org/guide/bootstrap#manual-initialization for start application when angular is ready

Collectives™ on Stack Overflow

Angular JS: Inject service within app.js

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related