在 angular 中单击按钮时更改 html 元素的字体大小

Question

这是我的模板。

<div>
<p>First</p>
<p>Second</p>
<div>
<p>Third</p>
<p>Fourth</p>
</div>
<button>+</button>
<button>+</button>

单击 +/- 我想 increase/decrease 说前三个段落元素的字体大小。怎么做

Answer 1

模板：

<div>
    <p [ngStyle]="{'font-size.px':fontSize}">First</p>
    <p [ngStyle]="{'font-size.px':fontSize}">Second</p>
    <p [ngStyle]="{'font-size.px':fontSize}">Third</p>
    <p [ngStyle]="{'font-size.px':fontSize}">Fourth</p>
</div>
<button (click)="IncrFontSize()">+</button>
<button (click)="DecreFontSize()">-</button>

代码：

   fontSize = 24;
   IncrFontSize() {
    this.fontSize++;
   }
   DecreFontSize() {
    this.fontSize--;
   }

在 angular 中单击按钮时更改 html 元素的字体大小

Change fontsize of html elements on button click in angular

font-size

angular