Ngx-admin: How to protect routes using guard?

[PatrickHuetter]

I would like to protect all routes except the login route with a guard which checks the loggedIn status using a self implemented userService.

I already followed this howto http://blog.thoughtram.io/angular/2016/07/18/guards-in-angular-2.html but i couldn't get this working with ng2-admin.

In which routes.ts should i put my guard?

[lichkovskyi]

Open pages.menu.ts and add canActivate property for your route. For example:

path: 'pages', 
canActivate: [ LoggedInGuard ]

Also make Guard Service. This example to get access for logged in users:

@Injectable()
export class LoggedInGuard implements CanActivate {
    constructor(private loginService: LoginService) {
    }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        return this.loginService.isLoggedIn();
    }

[Gelio]

If you're using [email protected] you should add your guards in _pages.routing.ts_, as this file describes most of the routes, at lease if you didn't change the configuration too much.

I have set up an authentication module, which exposes the login and logout routes. I include in in _pages.routing.ts_ as the first element of the array, before the _pages_ element, which contains routes that need to be protected. Then, all I did was set up a guard on the object with _pages_ path.
Here's my _pages.routing.ts_:

import { Routes, RouterModule }  from '@angular/router';

import { SignInComponent } from './sign-in';
import { LogoutComponent } from './logout';

const routes: Routes = [
  {
    path: 'sign-in',
    component: SignInComponent
  },
  {
    path: 'logout',
    component: LogoutComponent,
    data: {
      menu: {
        title: 'PAGE_LOGOUT',
        icon: 'fa fa-power-off',
        selected: false,
        expanded: false,
        order: 1000
      }
    }
  }
];

export const routing = RouterModule.forChild(routes);

And here's _authentication.routing.ts_ (custom module I've created, you can paste the contents of this array as the first element of the array in _pages.routing.ts_ and it would work the same, except for being lazily loaded, I think):

import { Routes, RouterModule }  from '@angular/router';

import { SignInComponent } from './sign-in';
import { LogoutComponent } from './logout';

const routes: Routes = [
  {
    path: 'sign-in',
    component: SignInComponent
  },
  {
    path: 'logout',
    component: LogoutComponent,
    data: {
      menu: {
        title: 'PAGE_LOGOUT',
        icon: 'fa fa-power-off',
        selected: false,
        expanded: false,
        order: 1000
      }
    }
  }
];

export const routing = RouterModule.forChild(routes);

At the time of writing this, I haven't seen what @lichkovskyi wrote. That is definitely valid. I focused on where to insert the guard, instead of how to do it.

[PatrickHuetter]

Thank you both, i got it working now. The problem was that i placed the AuthGuard in the wrong routing.ts. Your examples helped me to figure out the the correct location.