Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Ficou meio confuso na parte do service

Chegando nessa parte de criar o service ficou muito confuso a explicação, acredito que seria necessário uma revisão para deixar os conceitos mais claros. Acredito que ninguém gosta de fazer um conteúdo que não deixe claro o que está sendo feito. Desta forma, seria legal uma revisão nessa aula do curso.

Abraço!

5 respostas

Olá Francisco, tudo bem?

Agradecemos o feedback e estamos trabalhando para incluir melhorias nos próximos cursos, a fim de atender expectativas como as que você comentou.

Vou tentar esclarecer um pouco os conceitos, tá?

Services, em Angular, são classes responsáveis por guardar lógica de negócios, funções e dados úteis, por buscar dados do servidor e enviar dados ao servidor. Isso ajuda a separar responsabilidades.

Como consta na documentação:

Um componente pode delegar determinadas tarefas aos serviços, como buscar dados do servidor, validar a entrada do usuário ou fazer login.

Componentes consomem serviços; ou seja, você pode injetar um serviço em um componente, dando ao componente acesso a essa classe de serviço.

Ao definir essas tarefas de processamento em uma classe de serviço injetável, você disponibiliza essas tarefas para qualquer componente, aumenta a modularidade e a reutilização.

Para definir uma classe como service , você precisa utilizar o decorator @Injectable(), assim o Angular vai saber que é uma classe injetável

transferencia.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Transferencia } from '../models/transferencia.model';

@Injectable({
  providedIn: 'root',
})
export class TransferenciaService {
  private listaTransferencia: any[];
  private url = 'http://localhost:3000/transferencias/';

  constructor(private httpClient: HttpClient) {
    this.listaTransferencia = [];
  }

  todas() {
    return this.httpClient.get<Transferencia[]>(this.url);
  }

 //outros métodos da classe
}

Já as dependências são serviços ou objetos que uma classe precisa para desempenhar sua função. Injeção de dependência, ou DI, é um padrão de design no qual uma classe solicita dependências de fontes externas em vez de criá-las. Por exemplo, se a classe A tem dependência na classe B, então nós instanciamos a classe B e injetamos a instância na classe A para que ela possa utilizar.

Para injetar uma dependência em um componente, nós fornecemos um argumento no construtor com o tipo de dependência. extrato.component.ts

import { Component } from '@angular/core';
import { TransferenciaService } from '../services/transferencia.service';

@Component({
  selector: 'app-extrato',
  templateUrl: './extrato.component.html',
  styleUrls: ['./extrato.component.scss'],
})
export class ExtratoComponent implements OnInit {
  //código anterior

  constructor(private service: TransferenciaService) {}

  ngOnInit(): void {
    this.service.todas().subscribe((x) => (this.transferencias = x));
  }
}

O professor criou um serviço (transferencia.service.ts) e utilizou a injeção de dependência, para injetar esse serviço no componente (extrato.component.ts) para, assim, o componente ter acesso aos métodos da classe injetada (nesse caso, ele utilizou o método todas()).

Espero ter ajudado, bons estudos!

solução!

OK Nayanne, muito obrigado pelo retorno, no mesmo dia que eu publiquei a mensagem eu busquei mais informações em outras fontes e consegui elucidar minha dúvida e seguir com o curso.

De qualquer forma muito obrigado pela resposta, tenho certeza que vai ajudar muitos outros.

A propósito, desculpa a demora, tá Jardel? :)

Estamos realizando ações para melhorar com relação ao tempo de resposta no fórum.

Cheguei aqui na Alura mês passado e estou tentando responder a maior quantidade de dúvidas, mesmo que antigas, justamente porque podem ser dúvidas que outras alunas e alunos possam vir a ter e vai ajudá-los, como você comentou.

Muito obrigada pelo feedback, até mais! :)

Muito boa sua atitude, eu entendo que a demanda é alta. Parabéns e muito sucesso!

A todas e todos que tiverem dúvidas sobre o assunto, segue abaixo o link para o artigo sobre services e injeção de dependência no Angular que acabou de sair na plataforma.

Esperamos que gostem! :)