如何将 PrimeNG 中的 p-checkbox 标签放在复选框的左侧

【问题标题】：how to put p-checkbox label from PrimeNG on the left of the checkbox如何将 PrimeNG 中的 p-checkbox 标签放在复选框的左侧
【发布时间】：2021-09-28 06:04:37
【问题描述】：

 <p-checkbox name="group1" [value]="true" label="Outsourcing"
                             style="margin: 0 25px"></p-checkbox>

默认情况下，标签在复选框的右侧，如何将其更改为左侧？

【问题讨论】：

标签： html angular primeng

【解决方案1】：

您可以通过在p-checkbox 元素中将flex-direction 样式属性设置为row-reverse 来实现此目的。

<p-checkbox 
  name="group1" 
  [value]="true" 
  label="Outsourcing" 
  style="margin: 0 25px; flex-direction: row-reverse">
</p-checkbox>

工作示例：https://stackblitz.com/edit/angular-ivy-drzmxl?file=src/app/app.component.html

【讨论】：