Um serviço é uma classe para lógica não-UI — busca de dados, regras de negócio, estado compartilhado, logging — que componentes podem reutilizar. Injeção de Dependência (DI) é como Angular fornece esses serviços aos componentes que precisam deles, em vez de componentes criarem-nos manualmente.
{ } ;
({ : })
{
users = [];
() { .; }
() { ..(u); }
}
O decorador @Injectable({ providedIn: "root" }) registra o serviço no sistema de DI do Angular como uma única instância compartilhada (singleton) para toda a aplicação.
@Component({ ... })
export class UserListComponent {
// Angular sees this constructor param and INJECTS the singleton automatically
constructor(private userService: UserService) {}
users = this.userService.getUsers(); // just use it
}
Você simplesmente declara o serviço como um parâmetro de construtor; o DI do Angular cria e fornece a instância. Você nunca escreve new UserService(). (O Angular moderno também pode usar a função inject() em vez de injeção por construtor.)
import { inject } from "@angular/core";
export class UserListComponent {
private userService = inject(UserService); // alternative injection style
}
✓ Single source of truth — one shared UserService instance across components
✓ Loose coupling — components depend on the type, not on constructing it
✓ Testability — swap in a mock service in tests easily
✓ Lifecycle management — Angular handles creation and sharing
Porque o componente não constrói suas dependências, você pode injetar um serviço fake em testes ou alterar a implementação em toda a aplicação em um único lugar.
Serviços + DI são centrais na arquitetura do Angular: componentes permanecem focados na UI enquanto serviços mantêm lógica e estado, e DI os une com acoplamento mínimo.
Essa separação (e a testabilidade que traz) é uma das forças definidoras do Angular — emprestada de frameworks backend — e @Injectable({ providedIn: 'root' }) é o padrão cotidiano para um singleton compartilhado e injetável.