PrimeNg p-column 在 td 中应用 css 不起作用

Question

我正在使用 p-dataTable，我想在 td 中应用一种样式，但这种样式取决于字段的值，我不知道该怎么做。我的代码是：

<p-dataTable [value]="cars" resizableColumns="true" [responsive]="true" reorderableColumns="true">
  <p-column [styleClass]="carStyle" field="carDesc"></p-column>
  <p-column styleClass="ui-model-car" field="carModelDesc"></p-column>
  <p-column styleClass="ui-width-icon-car">
     <template let-col let-item="rowData" pTemplate type="body">
      <div data-toggle="tooltip" data-placement="left" title="{{item.typeCarDesc}}">
          <span class="icon-circle {{item.typeCarIcon}} {{item.carColor}}"></span>
      </div>
     </template>
  </p-column>
</p-dataTable>

carStyle 可以是空的或 ui-without-border-top 和我的 css：

td.ui-without-border-top {border-top-style: hidden;}

在我的 html 生成代码中，我没有看到 carStyle。我需要 td 中的样式。

Answer 1

在这种情况下，请检查 carStyle 类是否已添加到您的<td>。

我会毫无问题地展示我是如何做到这一点的：

在我的模板中：

<p-column styleClass="col-button">

还有我的 Scss：

table {
    tbody
    {
        td.col-button {
            text-align: center;
        }
    }
}

请参阅下面的屏幕截图，了解它在没有问题的情况下运行得如何：

请检查您的代码，然后重试。如果它不起作用，请发布您的问题。