Question

我试图在一个p列中的styleClass中调用一个函数，但它被称为很多次……比我想象的要多得多。有人可以向我解释该功能的工作原理吗？

这是我正在做的一个例子（我有20个p列，但这里只显示了几对）：

<p-datatable #dt [value]="mydata" var="dataRow" class="ui-g-6" [reorderableColumns]="true" columnResizeMode="fit" [resizableColumns]="true" [globalFilter]="tableSearch" [(selection)]="selectedArray" (onRowSelect)="onRowSelect($event)" [contectMenu]="tableContextMenu" rowGroupMode="rowspan" sortField="dataSource" [scrollable]="true" scrollHeight="400px" columnResize="expand" [responsive]="true">
    <p-column selectionMode="multiple" styleClass="selectBoxColumn"></p-column>
    <p-column field="name" header="Site Name" [sortable]="true" styleClass="{{changeColor(mydata)}}></p-column>
    <p-column field="index" header="Site Index" [sortable]="true"></p-column>
</p-datatable>

我期望它在每一行中循环遍历p列。因此，changeColor将被调用3次（每行一次）。但是，它的调用次数超过200次！我的总列数为20，而我只有3行数据。

有人可以解释为什么changeColor被多次调用吗？有什么办法可以限制它？

我试图根据其值为该列设置颜色。我在changeColor中进行处理，然后将颜色返回给类。

在页面的初始加载中，我可以看到颜色开始出现，但随后被擦除。我猜测是因为changeColor被调用了很多次。

更新：如果我能使颜色正确返回，我不会在乎changeColor被调用的次数。这是changeColor中的示例：

if (localName == "Atlanta") {
    console.log("Chose Atlanta!");
    return 'blue';
} else {
    return 'red';
}

我可以看到console.log打印出来的“选择亚特兰大！”亚特兰大的两排两次。但是，这些列全都是红色。再次，我猜测所有额外的时间，此函数称为列名不是亚特兰大，因此默认为红色。很奇怪！

Answer 1

好吧...伙计们...这很奇怪，但这是正在发生的事情。当我打电话给changeColor时，我正在传递行mydata的数据。我在changeColor中有一个console.log记录了这些数据。我可以看到它为我的3行写了3次。在其他所有时间里，它只是写了一个空数组。一位同事建议我只输入要检查的值。所以...我的行现在看起来像这样（对于新的turbotable模型）：

<td [ngClass]="changeColor(doc.name)">
   {{doc.name}}
</td>

现在，我只传递想要的值，而不是整个行...现在可以使用了！我真的不明白为什么在整行中传递会导致它循环很多次..但是就是这样！感谢所有看过这个的人！

为什么在p引号中这么多次调用p列？

1 个答案: