右对齐 InputNumber 内容答案

【问题标题】：Right Align InputNumber content右对齐 InputNumber 内容
【发布时间】：2017-05-21 21:24:44
【问题描述】：

我编写了一个对每个单元格使用 InputNumber 的 DataTable。一切正常，但由于 InputNumbers 内容的左对齐，表格看起来参差不齐。我尝试过的所有格式都设置了控件本身的格式，而不是其内容。有没有办法右对齐 InputNumber 的内容？

【问题讨论】：

【解决方案1】：

如果有人在 2020 年或之后访问此页面：

对于 PrimeNG 10，输入样式需要 Angular ngStyle 语法。只需执行以下操作：

<p-inputNumber [(ngModel)]="0.00" [inputStyle]="{'text-align': 'right'}"></p-inputNumber>

【讨论】：

【解决方案2】：

对于inputNumber，有属性inputStyle 和inputStyleClass。

我设法让我的数字输入正确对齐，如下所示：

<p:inputNumber value="0.00" inputStyle="text-align: right" />

【讨论】：

【解决方案3】：

我会做类似的事情

span.ui-inputnumber > input[type=text] {
    text-align: right;
}

这应该可以捕获所有 p:inputNumber 的所有内容。

【讨论】：

【解决方案4】：

添加下面的css

.ui-datatable tr>td:nth-child(2)
{
  text-align:right;

}

【讨论】：

【解决方案5】：

在 2021 年，使用 angular 11 和 primeng v11.3.2 @J-Eibe answer 仍然有效，如果您只想设置单个 p-inputNumber 的样式，但如果您想要更通用，请将以下代码放在您的 style.css 中

.p-inputnumber-input{
  text-align: right;
}

【讨论】：