Question

我正在处理角管以处理和过滤日志。

我的烟斗看起来像这样

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部分

 <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（＆＃39; message＆＃39;，function（message，user） { this.messages.push（{用户：用户，MSG：消息}）;

}

如果我输入输入文本但过滤器工作正常但是如果之后添加了新消息，那里没有显示（例如过滤），我想有什么东西可以调用来触发过滤更新？

Answer 1

角度变化检测不检测数组内部的更改，只检测数组实例（传递不同的数组实例）

使管道不纯净

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

每次对使用管道的组件执行更改检测时，Angular2都会执行管道。

或者，您也可以在每次修改后使用this arr = this.arr.splice()创建阵列的不同副本，以便更改以获得Angular的通知。

这取决于用例和数组大小哪种方法更有效。

angular2管道和新数据

1 个答案: