[RC0] <ion-item> not refreshing DOM


#1

Hi,
First sorry for my English. I need your’s help.

I have created a method that removes one item from array. Everything looks good except for the refresh DOM. Refreshes only after passing by for example the dashboard and back.
Please look at my code:

<ion-content>
    <ion-list>
        <ion-item-group *ngFor="let group of resources | groups | orderBy: 'date'">
            <ion-item-divider sticky>{{ group.date }}</ion-item-divider>

            <ion-item-sliding *ngFor="let item of group.resources | orderBy: 'time'">
                <button ion-item (click)="itemTapped($event, item)">
                    <span class="item-time">{{item.time}}</span>
                    <span>{{item.name}}</span>
                    <div class="item-note" item-right>{{item.value}}</div>
                </button>
                <ion-item-options side="left">
                    <button ion-button color="danger" (click)="deleteItem(item)">
                        <ion-icon name="trash"></ion-icon>Usuń
                    </button>
                </ion-item-options>
            </ion-item-sliding>
        </ion-item-group>
    </ion-list>
</ion-content>

resources.ts

import { Component, Input } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { ItemDetailsPage } from '../item-details/item-details';

export class ResorcesPage {
(...)

@Input() item;
@Input() resources: Array<any>;

(...)

deleteItem(item) {
      for(var i = 0; i < this.resources.length; i++) {
            if(this.resources[i] == item) {
            console.log('removed:' + item + '', i);
            this.resources.splice(i, 1);
        }
    }
}

group-pipe.ts

import { Injectable, Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'groups' })

@Injectable()
export class Groups implements PipeTransform {
    transform(value, args?: string[]): any {
        let groups = {};
        value.forEach(function(o) {
            let date = o.date;
            groups[date] = groups[date] ? groups[date] : { date: date, resources: [] };
            groups[date].resources.push(o);
        });
        return Object.keys(groups).map(function(key) { return groups[key] });
    }
}

Please help solved this problem. Thanks!


Rc0 - Sliding Items erratic behavior
#2

Read this: Pure and Impure Pipes


#3

thx for reply but…
I tried to use pure property but ion-item-sliding stopped working…

Edit :

I know where is problems.
The problem it is ion-item-sliding becouse ion-item-options not working using pure property in @Pipe
… and I using DeleteItem () method on the ion-item button … method it’s work from active pure: false.