Created
June 18, 2018 15:16
-
-
Save openopen114/2b1fcf0eb6dd718a3e80d13398dfc718 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//HTML | |
<input type="text" [(ngModel)]="_num"/> | |
<ul> | |
<li *ngFor="let item of numList | numFilter:_num"> | |
{{item.po}} | |
</li> | |
</ul> | |
<p>_num:{{_num}}</p> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//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() { | |
} | |
} | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//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