Angular: Value-to-variable assignment

Asked

Viewed 518 times

0

I have a method that calls a service from an API and stores its result in a variable, but this result is not being assigned the variable I need.

atribuirImagem(): void {
    this.imagemService.enviarArquivo(this.arquivoSelecionado)
      .subscribe(
        image => {
         //Atribuindo valor
          this.usuario.imagem = image;
        });
  }

I have another method to call a service that sends a user POST by API. But in this user that I pass as parameter does not reach the variable that I assign in the other method.

cadastrarUsuario(): void {
    this.ativarSpinner = true;

if(this.arquivoSelecionado != null){
  this.atribuirImagem();
}

this.usuarioService.cadastrarNovoUsuario(this.usuario)
  .subscribe(
    ok => {},
    err => {
      this.mensagemValidacao = err.error;
    });

this.ativarSpinner = false;

}

The user being passed as parameter does not have the value which was assigned in the other method. What is the problem in this case?

angular typescript front-end component

  • image => { console.log(image)} what is the printable value?

  • I suppose since the method is asynchronous, you will only get what you want if you put the registration snippet into the image => {

  • @veroneseComS the printable value is the name of the image itself.

  • Probably your problem will be solved if you pass the registration contentNovUsuario inside your subscribe

  • @veroneseComS in the image case => { metodo(). That would be it?

  • image => { this.usuarioService.cadastrarNovoUsuario...

  • 1

    @veroneseComS I did it this way, it worked, thank you.

Show 2 more comments

2 answers

0

Cara tries this way. Any doubt sticks to the stackblitz that I help you.

async atribuirImagem(): void {
    this.imagemService.enviarArquivo(this.arquivoSelecionado)
      .subscribe(
        image => {
         //Atribuindo valor
          this.usuario.imagem = image;
         await this.efetivaCadastro(this.usuario);
        });
  }


async cadastrarUsuario(): void {
    this.ativarSpinner = true;

if(this.arquivoSelecionado != null){
  await this.atribuirImagem();
}
this.ativarSpinner = false;
}


async efetivaCadastro(user): void {
this.usuarioService.cadastrarNovoUsuario(user)
  .subscribe(
    ok => {console.log(ok)},
    err => {
      this.mensagemValidacao = err.error;
    });
}

0

The Angular uses observables as an interface to handle a variety of operations asynchronous and that’s why you can’t use the value assigned in this variable out of the subscribe.

You have several other ways to utilize the value of subscribe, but use an outside auxiliary variable to take the value inside the subscribe and uses it out there you won’t be able to, so you can:

  • 1) Insert all necessary code into the subscribe;
  • 2) Create a function that returns a Observable and give subscribe using this function;
  • 3) Make schedule reactive to events and use .toPromise() and return a Promise<> in a method;

Browser other questions tagged angular typescript front-end component

You are not signed in. Login or sign up in order to post.