Angular：ngFor中重复项的条件类

Question

有一个代码

<li *ngFor="let color of colors;" [class.duplicate]="color.hex == colors[0].hex">{{color.hex}}<li>

会根据颜色列表的颜色对象的十六进制属性填充十六进制代码列表。

结果，上面的duplicate类被分配给十六进制与第0个项目的十六进制相同的任何项目 。

正确？

是否可以修改此代码，以便将duplicate类应用于任何重复项，而不仅仅是与0th项目进行比较

Answer 1

您可能需要向控制器添加功能。 我的Angular2 +生锈了，但具有以下作用：

<li *ngFor="let color of colors;" [class.duplicate]="findDuplicate(index, color)">{{color.hex}}<li>

function findDuplicate(index, color){
    return colors.find((checkColor, checkIndex) => {
        let isDuplicate = (checkIndex != index) && (color.hex == checkColor.hex);
        return isDuplicate;
    });
}

注意： checkIndex != index用于防止在数组中找到当前颜色时将其标记为重复。