Skip to content

Instantly share code, notes, and snippets.

@openopen114
Created June 18, 2018 15:16
Show Gist options
  • Save openopen114/2b1fcf0eb6dd718a3e80d13398dfc718 to your computer and use it in GitHub Desktop.
Save openopen114/2b1fcf0eb6dd718a3e80d13398dfc718 to your computer and use it in GitHub Desktop.
//HTML
<input type="text" [(ngModel)]="_num"/>
<ul>
<li *ngFor="let item of numList | numFilter:_num">
{{item.po}}
</li>
</ul>
<p>_num:{{_num}}</p>
//TS
import { Component, OnInit } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms';
import { NumFilterPipe } from '../num-filter.pipe';
@Component({
selector: 'app-num',
templateUrl: './num.component.html',
styleUrls: ['./num.component.css']
})
export class NumComponent implements OnInit {
_num;
numList = [
{po:'500123'},
{po:'94938'},
{po:'7857'}
];
constructor() { }
ngOnInit() {
}
}
//ng g pipe numFilter
//num-filter.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'numFilter'
})
export class NumFilterPipe implements PipeTransform {
transform(numList: any, _num: any): any {
if(_num === undefined) return numList;
return numList.filter(item => {
console.log(item.po.includes(_num));
return item.po.includes(_num);
})
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment