Need some help regarding Observables in a service

[Simon Azzopardi]

Hi guys,

I am trying to do the AuthGuard for CanActivate and I am trying to get, through http, either true or false, if user is logged in.

I have this code in the AuthService.ts

 public subscribeIsUserLoggedIn() : Boolean{

        this.checkIfUserIsLoggedIn().subscribe(

            result => {

               this. _loginResponseModel = result;

                 console.log(this._loginResponseModel.IsAuthenticated);

            }

             

         );

         console.log(this._loginResponseModel.IsAuthenticated);

        return this._loginResponseModel.IsAuthenticated;

    }

The first log is the actual value (true or false) but the other login is undefined.

Outside the subscribe, value is being lost.

Any help pleasE?

[Lucas Lacroix]

The callback occurs after your second console.log call. Observables are asynchronous.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

[Simon Azzopardi]

Yes I know that, so what I am doing wrong? how can I get that value to return it back?

thanks for your reply and you help.

[Lucas Lacroix]

It all depends on what is calling your function. You could, for example, just return the observable. But that would require that the caller supports observavles. Angular 2's "CanActivatec might - I haven't looked into it.

[Simon Azzopardi]

Another Service is calling that method:

 

import { Injectable }             from '@angular/core';

import { CanActivate,

         Router,

         ActivatedRouteSnapshot,

         RouterStateSnapshot }    from '@angular/router';

import { AuthService }            from './auth.service';

import { LoginResponseModel } from './Login/loginResponseModel';

@Injectable() 

export class AuthGuard implements CanActivate{

    constructor(private _authService: AuthService, private _router: Router) {}

    canActivate(

         next:  ActivatedRouteSnapshot,

        state: RouterStateSnapshot

    ){

         

        if(this._authService.subscribeIsUserLoggedIn()){

            return true;

        }else{

            this._router.navigate(['/login']);

            return false;

        }

    }

} 

[Lucas Lacroix]

A simple Google search turned up a solution which seems to match exactly what you want to do:
https://github.com/angular/angular/issues/4112

--

[Simon Azzopardi]

For which one you referring to as a solution?

[Lucas Lacroix]

Redirecting to another component when login is required.

[Simon Azzopardi]

of DrClick?

[Simon Azzopardi]

Hi Lucas,

I don't see an actual solution for my problem.

[Simon Azzopardi]

This is the solution:

import { Injectable }             from '@angular/core';

import { CanActivate,

         Router,

         ActivatedRouteSnapshot,

         RouterStateSnapshot }    from '@angular/router';

import { AuthService }            from './auth.service';

import {Observable} from 'rxjs/Observable';

@Injectable() 

export class AuthGuard {

    constructor(private _authService: AuthService, private _router: Router) {}

    canActivate(): Observable<boolean>{

        return this._authService.checkIfUserIsLoggedIn()

        .map((result) => {

                console.log(result["_body"])

if (result["_body"] == "true") {

return true;

} else {

this._router.navigate(['/login']);

return false;

}

});  

    }

} 

[Lucas Lacroix]

Take a look at the first plunkr.