angular2パイプと新しいデータ

Question

ログを処理しフィルタリングするために角パイプで作業しています。

私のパイプは

<input type="text" [(ngModel)]="filterLog" class="validate" /> 

<ul id="messages"> 
    <li *ngFor="let msg of messages | logFilter:filterLog"> <div class="chip">{{ msg.user }}</div> {{ msg.msg }}</li> 
</ul> 

新しいメッセージがsocket.io入力

this.socket.on（ 'メッセージ' を投げる追加することができ、この

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

@Pipe({ 
name: 'logFilter' 
}) 
@Injectable() 
export class logFilterPipe implements PipeTransform { 
    transform(items: any[], args: any[]): any { 
    //console.log(items); 

    if (!args || args.length == 0) 
    { 
     return items; 
    } 

    return items.filter(item => item.msg.indexOf(args[0]) !== -1); 

} 
} 

HTML部分のように見えます、関数（メッセージ、ユーザー） { this.messages.push（{ユーザー：ユーザー、msg：メッセージ}）;

}

入力テキストを入力するとフィルタが正常に機能しますが、その後に新しいメッセージが追加されて表示されていない（フィルタされていないなど）場合は、フィルタリングの更新をトリガするための呼び出しがありますか？

Answer 1

角度変化の検出は、アレイ内の変化のみ配列インスタンスの変更（異なる配列のインスタンスを渡す）を検出しない

パイプ不純

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

がAngular2パイプ毎回変化検出を実行させる作りますパイプが使用されているコンポーネントに対して実行されます。

また、変更するたびにthis arr = this.arr.splice()を使用して、変更のために別のアレイコピーを作成して、角度で通知することもできます。

どのアプローチがより効率的であるかは、ユースケースと配列サイズによって異なります。