Pause for Progress - Angular 6

Question

Pause for Progress - Angular 6

I'm looking for a solution to solve the following issue. I need to access a property that will store data from an http request. Therefore, I want to verify this property only after the transaction is completed.

  validateAuthorization(path: string): boolean{
    const currentUser: UserStorage = this.storage.getCurrentUser();
    let user: User
    this.userService.findUserByLogin(currentUser.login).subscribe(
        data => {
            user = data
        }

    )

    if (user.profile.springSecurity == 'ROLE_ADMIN'){
        return true;
    } else {
        const message: Message = {message: 'User does not have permission', type: MessageType.ERROR}
        this.message.notify(message)
        return false;

    }
}

angular typescript

Answer 1

Answer №1

To implement the necessary changes, you must update the function to return an observable instead. Utilize the map method to convert the data into the desired boolean outcome.

checkAuthorization(path: string): Observable<boolean>{
    const loggedInUser: UsrStoraged = this.storage.getLoggedInUser();
    return this.userService.findByLogin(loggedInUser.login).pipe(map(
        data => {
            const user = data

            if (user.profile.springSecurity == 'ROLE_ADMIN'){
                return true;
            } else {
                const message: Message = {message: 'User does not have permission', type: MessageType.ERROR}
                this.message.notify(message)
                return false;
            }
        }
    ))
}

If you haven't already done so, remember to import the necessary modules:

import {Observable} from "rxjs"
import {map} from "rxjs/operators"

Next, ensure that any code calling this function subscribes to the result. For instance, instead of:

if (checkAuthorization("foo")) {
    // do stuff
} else {
    // do other stuff
}

You should use:

checkAuthorization("foo").subscribe(isAuthorized => {
    if (isAuthorized) {
        // do stuff
    } else {
        // do other stuff
    }
})

Answer 2

To implement the necessary changes, you must update the function to return an observable instead. Utilize the map method to convert the data into the desired boolean outcome.

checkAuthorization(path: string): Observable<boolean>{
    const loggedInUser: UsrStoraged = this.storage.getLoggedInUser();
    return this.userService.findByLogin(loggedInUser.login).pipe(map(
        data => {
            const user = data

            if (user.profile.springSecurity == 'ROLE_ADMIN'){
                return true;
            } else {
                const message: Message = {message: 'User does not have permission', type: MessageType.ERROR}
                this.message.notify(message)
                return false;
            }
        }
    ))
}

If you haven't already done so, remember to import the necessary modules:

import {Observable} from "rxjs"
import {map} from "rxjs/operators"

Next, ensure that any code calling this function subscribes to the result. For instance, instead of:

if (checkAuthorization("foo")) {
    // do stuff
} else {
    // do other stuff
}

You should use:

checkAuthorization("foo").subscribe(isAuthorized => {
    if (isAuthorized) {
        // do stuff
    } else {
        // do other stuff
    }
})

Answer 3

Answer №2

data => { will be triggered upon receiving it, allowing you to encapsulate your code within:

checkAuthorization(path: string): boolean{
    const usuarioLogado: UsrStoraged = this.storage.getUsuarioLogado();
    let usuario: Usuario
    this.usuarioService.findByLogin(usuarioLogado.login).subscribe(
        data => {
            usuario = data
            if (usuario.perfil.springSecurity == 'ROLE_ADMIN'){
                return true;
            } else {
                const message: Message = {message: 'Usuário sem permissão', type: TipoMensagem.ERROR}
                this.message.notify(message)
                return false;

            }
        } 
    );
}

Tip: To handle errors, include error => {} similar to the structure of data mentioned above.

Answer 4

data => { will be triggered upon receiving it, allowing you to encapsulate your code within:

checkAuthorization(path: string): boolean{
    const usuarioLogado: UsrStoraged = this.storage.getUsuarioLogado();
    let usuario: Usuario
    this.usuarioService.findByLogin(usuarioLogado.login).subscribe(
        data => {
            usuario = data
            if (usuario.perfil.springSecurity == 'ROLE_ADMIN'){
                return true;
            } else {
                const message: Message = {message: 'Usuário sem permissão', type: TipoMensagem.ERROR}
                this.message.notify(message)
                return false;

            }
        } 
    );
}

Tip: To handle errors, include error => {} similar to the structure of data mentioned above.

Pause for Progress - Angular 6

Answer №1

Answer №2

Similar questions

Methods to validate CSS attributes specified within a class using React testing library

Issues with using hooks in a remote module in Webpack 5 module federation

When you want to place an image in the middle of a cell, you can easily achieve this by utilizing the addImage function

Craft dynamic SVG components using TypeScript

The production build encountered an issue as it was anticipating 3 arguments, however, it only received

evaluate a utility function that operates on children

Angular CDKScrollable not triggering events

Using Angular, a function can be called recursively directly from within the HTML

Experiencing template parsing errors in Angular 2+ unit tests with Karma and Jasmine

Webpack is throwing an error: TypeError - It seems like the object prototype can only be an object or null, not

ngx-translate is failing to display any text within a lazily-loaded module

What is the process for including an item in an array within Firestore?

Angular Observable does not reflect updates automatically

Steps for storing API information in localStorage:1. Retrieve the API data

Can a custom structural directive be utilized under certain circumstances within Angular?

Angular2 - adding the authentication token to request headers

How to set the default theme color for the mat-sidenav background in Angular 6 and 7?

Data fetched using React Query

Angular 2+ encountering an internal server error (500) while executing an http.post request

Angular 16 HttpClient post request with asynchronous action