濾波器輸入在角2

Question

如何寫一些@Pipe用於過濾（在<input>標籤）在表中的數據？

<tr *ngFor='let list of lists'> 
     <td><input type="" name="" value=""></td> 
     <td>{{ list.name }}</td> 
     <td>{{ list.location }}</td> 
     <td>{{ list.type_id }}</td> 
    <tr> 

的數據，我從API獲得與HTTP服務：

getServices(): Observable<any> { 
     return this._http.get(this._url) 
      .map(res => res.json()); 
    } 

UPD：

這是我的服務組件：

import {Injectable} from '@angular/core'; 
import {Http, Headers, RequestOptions} from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 

import 'rxjs/add/operator/map' 

@Injectable() 
export class TableComponentService{ 
    private _url = 'http://101.496.222.511:8080/api/v1/10'; 

    constructor(private _http: Http) { 

    } 

    names:string[]; 
    getServices(): Observable<any> { 
     return this._http.get(this._url) 
      .map(res => res.json()); 
    } 

} 

，這是一個表組件

import { Component, OnInit } from '@angular/core'; 
import { TableComponentService } from './table.service'; 

@Component({ 
    selector: 'tablecomponent', 
    templateUrl: 'app/table.template.html', 
    providers: [TableComponentService] 
}) 
export class TableComponent implements OnInit { 
    lists: any[]; 

    constructor(private _service: TableComponentService) { 

    } 

    ngOnInit() { 
     this._service.getServices() 
      .subscribe(lists => this.lists = lists) 
    } 

} 

Answer 1

相反管的使用keyup事件通過使用可變

例

<tr *ngFor='let list of lists'> 
     <td><input type="" name="" value="" (keyup)="getServices()" > 
     <span *ngFor='let name of names'>{{name }}</span> 
     </td> 
     <td>{{ list.name }}</td> 
     <td>{{ list.location }}</td> 
     <td>{{ list.type_id }}</td> 
<tr> 


names:string[]; 
getServices(): Observable<any> { 
    this.names=this._http.get(this._url) 
     .map(res => res.json()); 
} 

EDIT調用getservices（）和存儲在一個變量接收到的值，並顯示結果，無論你想： -

使_Service公衆構造

constructor(public_service: TableComponentService)

然後在HTML

<input type="" name="" value="" (keyup)="_service.getServices()" >