Угловое свойство связывания петли больше, чем должно

Question

В моем массиве pitanje ['odgovori'] у меня есть 3 значения, поэтому он должен зацикливаться только три, но каким-то образом он зацикливается несколько раз, смотрит на картинку ... Итак, [0,1,2] и зацикливается несколько раз ...Моя цель состоит в том, чтобы передать это значение в changeColor () и сравнить с другим, чтобы изменить базовую цветность чипа на этом

HTML

<ion-chip *ngFor="let odgovor of pitanje['odgovori']; index as i" 
 [color]="changeColor(i)">
     <ion-icon name="checkmark-circle"></ion-icon>
     <ion-label>{{ odgovor }}</ion-label>
</ion-chip>

TS

changeColor(value: number) {
    console.log(value);
}

Answer 1

Решением будет использование канала для функции changeColor.Канал получит значение i, а его функция преобразования выполнит то, что должна делать функция changecolor.

Преимущество конвейера в том, что он чистый и больше не повторится после обнаружения изменения, если он не связан с состояниемкоторые напрямую изменяют результат конвейера.

Другое решение состоит в том, чтобы использовать lodash-декораторы и декоратор memoize.

import {memoize} from 'lodash-decorators';

@memoize()
changeColor(value: number) {
    console.log(value);
}

Это не приведет к вводу функции, если она вызывается с теми же значениями.