Angular - обновить индекс ngFor на фильтре

Question

У меня есть список с * ngFor в шаблоне:

<li *ngFor="let product of products | filterProducts: selectedFilter; index as productId">
    <a [routerLink]="['/product', productId]">
      {{product.name}}
    </a>
</li>

Поэтому я использую канал filterProducts для фильтрации элементов массива с выбранными параметрами, но при изменении массива он не обновляет productId в шаблоне, так что routerLink выводит меня на страницу с неправильными сведениями (она использует идентификатор продукта в исходном массиве).

Любая помощь с этим? Мне нужно обновлять productId в шаблоне каждый раз, когда я фильтрую элементы в массиве.

Answer 1

Похоже, вы пытаетесь использовать index в качестве productId, я думаю, что вы должны использовать какое-то свойство product, например product.id или product.productId в routerLink, например, вам также не нужен индекс как productId. [Вы также можете удалить это]

<li *ngFor="let product of products | filterProducts: selectedFilter; index as productId">
    <a [routerLink]="['/product', product.productId]">
      {{product.name}}
    </a>
</li>

Answer 2

index как productId установить индекс товара в массиве товаров. Это похоже на productId = products.indexOf (product). Попробуйте использовать свойство id в объекте продукта