CODEWITHSUNDEEP
angular
JaSHin
JaSHin

Reputation: 277

Object change detection in array

I need to manually (or automatically) change detect property of object in array. I have array of productShops entity in ngFor loop which is filtered by "isNotDeleted" property. When I change value of isNotDeleted property angular does not detect change.

<ul class="nav nav-tabs">
    <li *ngFor="let productShop of product.productShops | filter:'isNotDeleted':true" >
        <a href="#categoryAssocTab{{productShop.shop.id}}" data-toggle="tab">{{productShop.shop.name}}</a>
    </li>
</ul>

EDIT: Pipe implementation:

import {Pipe, PipeTransform} from "@angular/core";

@Pipe({
    name: 'filter'
})
export class FilterPipe implements PipeTransform{

    transform(value:Array<any>, property, equal){

        let properties = property.split('.')

        if(value){
            return value.filter(item => {

                let finalValue:any = item

                properties.forEach(p => {
                    finalValue = finalValue[p]
                })

                return finalValue == equal
            })
        }

        return []
    }

}

Upvotes: 0

Views: 1448

Answers (1)

yurzui
yurzui

Reputation: 214047

Your pipe should be marked as not pure, because the result of its transformation for a given input can change even though the input hasn't changed.

@Pipe({
    name: 'filter',
    pure: false
})

See also

Upvotes: 1

Related Questions