1

Quiero colocar un boton en el html que cuando de clic aumente 2px el valor del fontsize y otro boton que al dar clic disminuya dos pixeles el valor del fontsize.

actualmente tengo el codigo asi pero solo me lo cambia a los que tengan el id #para, pero necesito que se cambie para todo el sitio.

export class HeaderComponent implements OnInit {
  
  fontSize = 14;
  @ViewChild('para', {static: true}) para: ElementRef;

 
  changeFont(operator){
    operator === '+' ? this.fontSize++ : this.fontSize--;
    (this.para.nativeElement as HTMLElement).style.fontSize = `${this.fontSize}px`;
  }

el html lo tengo asi:

<div (click)="changeFont('+')" class="font-control" id="font-up">A<sup>+</sup></div>
<div (click)="changeFont('-')" class="font-control" id="font-down">A<sup>-</sup></div>

Como podria hacer que cuando den clic aumente o disminuya a todos los componentes

1 respuesta 1

0

Aplica el cambio de fuente al body.

  changeFont(operator){
        operator === '+' ? this.fontSize++ : this.fontSize--;
        document.getElementsByTagName('body')[0].style.fontSize  = `${this.fontSize}px`;
    }

Solo revisa que el index.html tenga un body:

 <html>
    <body>
        <my-app>loading</my-app>
    </body>
  </html>
2
  • Gracias, funcionó.
    – ayaleil
    Commented el 14 dic. 2020 a las 17:52
  • Recuerda marcar la respuesta como "mejor respuesta" para que sea de utilidad para otras personas con el mismo problema.
    – Lobos
    Commented el 14 dic. 2020 a las 19:39

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.