Header Ads Widget

Ticker

6/recent/ticker-posts

Pasar parámetros al servicio Angular 10 con @Inject

 Puede pasar parámetros a los servicios de Angular 10 (y versiones anteriores), utilizando el @Injectdecorador para crear tokens de inyección. Le permite pasar parámetros al servicio a través del inyector de dependencia Angular.

Los tokens de inyección le permiten inyectar cualquier valor que no tenga una representación en tiempo de ejecución, como las interfaces TypeScript que no tienen equivalentes de JavaScript.

Ejemplo de componente y servicio angular

Supongamos que tenemos un servicio que necesita un parámetro de la siguiente manera:

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

@Injectable({
  providedIn: 'root'
})
export class MyService {
    constructor (private param: string) { }
}

Este es un componente de ejemplo que haría uso del servicio:

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

@Component({
  selector: 'app-my',
  template: `
    <div"> </div>
  `,
})
export class MyComponent {

  constructor() { }

}

Ahora, tenemos que pasar paramal servicio.

Creación de un token de inyección con @Inject

Podemos crear un token de inyección a partir del parámetro usando el @Injectdecorador:

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

@Injectable({
  providedIn: 'root'
})
export class MyService {
  constructor (
    @Inject('param') private param: string
  ) { }
}

Proporcionar la punta de inyección

A continuación, proporcionamos el token al servicio utilizando la providersmatriz del componente de la siguiente manera:

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

@Component({
  selector: 'app-my',
  template: `
    <div ></div>
  `,
   providers: [
    {provide: 'param', useValue: 'container'},
  ]
})
export class MyComponent {

  constructor(private myService: MyService) { }

}

Ahora hemos pasado un parámetro a nuestro servicio Angular 10.

Publicar un comentario

0 Comentarios