角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> 

私はHTTPサービスとAPIから取得したデータ：

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

代わりのパイプ（getservicesを呼び出す）、変数で受け取った値を格納し、あなたが好きな場所変数

例

<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を使用して結果を表示するためにイベントをkeyUpイベント使用： -

はコンストラクタで_service公開し

constructor(public_service: TableComponentService)

は、HTML

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