typescript - Angular 11: ¿Cómo usar un servicio en un archivo ts regular?
Tengo un archivo utils.ts que tiene algunas funciones exportadas como deepCopy y sortArray o algo así, pero quiero usar un servicio en algunas funciones, ¿cómo puedo hacer eso?
// utils.ts
export function copy(str:string){
// set clipBoard...
// here I want to use a service, how to use toastService?
// toastService.success('copied!');
}
Respuesta #1
Creo que solo hay una manera para ti: convertir tu función utilitaria en el método del servicio y usarla en todas partes como un servicio normal.
@Injectable({
providedIn: 'root'
})
export class HelperService {
constructor(
private toastService: ToastService,
){}
public copy(str:string): void{
// set clipBoard...
// here I want to use a service, how to use toastService?
this.toastService.success('copied!');
}
}
y úsalo así:
this.helperService.copy('Something');
Debería ser así, porque necesitas obtener ToastService del DI y el decorador Injectable lo hará por ti.
Respuesta #2
Aunque podrías crear una nueva instancia de ToastService en tu función, no recomendaría ese enfoque ya que perderías todos los beneficios de la inyección de dependencias (DI).
Podría verse de la siguiente manera:
export function copy(str:string){
// set clipBoard...
const toastService = new ToastService();
toastService.success('copied!');
}
En cambio, recomendaría hacer que tus utils sean un servicio, tal como dijeron otros (y en mi opinión esa es la mejor solución), o extraer el código común a otra función (si es posible) y usarlo en ambos lugares. Podría verse así:
shared.utils.ts:
export function toastSuccess(message: string) {
// your logic
}
toast.service.ts
import {toastSuccess} from './shared.utils';
@Injectable({providedIn: 'root'})
export class ToastService {
success(message: string) {
toastSuccess(message);
}
}
utils.ts
import {toastSuccess} from './shared.utils';
export function copy(str:string){
// set clipBoard...
toastSuccess('copied!');
}
