Olá, Israel, tudo bem? Espero que sim!
Entendo que você esteja procurando uma maneira de habilitar e desabilitar as animações no Angular de forma mais simples. Uma opção seria criar um serviço para gerenciar as configurações de animação do usuário.
Você pode criar um serviço chamado "AnimationService" que armazena o estado das animações (ligado ou desligado) e disponibiliza métodos para alterar esse estado. Por exemplo:
import { Injectable } from '@angular/core';
@Injectable()
export class AnimationService {
private animationEnabled: boolean = true;
constructor() { }
public enableAnimation(): void {
this.animationEnabled = true;
}
public disableAnimation(): void {
this.animationEnabled = false;
}
public isAnimationEnabled(): boolean {
return this.animationEnabled;
}
}
Dessa forma, você pode injetar esse serviço em qualquer componente que precise controlar as animações e utilizar os métodos enableAnimation
e disableAnimation
para habilitar e desabilitar as animações, respectivamente.
Por exemplo, suponha que você tenha um componente chamado "MeuComponente" que utiliza animações. Você pode injetar o serviço AnimationService
nesse componente e utilizá-lo da seguinte maneira:
import { Component } from '@angular/core';
import { AnimationService } from 'caminho/para/animation.service';
@Component({
selector: 'meu-componente',
templateUrl: './meu-componente.component.html',
styleUrls: ['./meu-componente.component.css']
})
export class MeuComponenteComponent {
constructor(private animationService: AnimationService) { }
public toggleAnimation(): void {
if (this.animationService.isAnimationEnabled()) {
this.animationService.disableAnimation();
} else {
this.animationService.enableAnimation();
}
}
}
No exemplo acima, o método toggleAnimation
verifica se as animações estão habilitadas ou desabilitadas e alterna o estado usando os métodos do serviço AnimationService
.
Espero ter ajudado!
Caso tenha dúvidas, fico à disposição.
Abraços e bons estudos!