角度2からデータベース値を検索する方法は？

Question

私はangular2アプリケーションを持っており、検索機能を追加したいと思っています。

私は、テキストボックスとボタンを追加しました。ボタンをクリックすると、そのテキストボックスから値が取得され、バックエンドに渡されます（エクスプレスフレームワークで構築されます）。

マイコードは次のとおりです。

<input type="text" name="search" class="form-control" formControlName="search/> 
<button type="submit" name="button"(click)="search()">Search</button> 

そして、ボタンクリックイベント、

search(){ 
    const activity = { 
    search: this.form.get('search').value, 
} 
this.Service.getSearch(activity.search).subscribe(data => { 
    this.activitylist = data.activities; 

は、その後のバックエンドにアクセスするためのサービスクラスがあります。私はどうしているのですか、私はparamsを使っています。バックエンドから値を取得します。

今私は、このクエリをしたいです。

は私のURLに残りのURL形式を与えます。

ときに誰かの検索、URLは

'/allActivities?search='+search 

のように、このようなものになるでしょうか？

誰かがこれを行う方法を教えてもらえますか？ APIを表現するために角2のフロントエンドからこれを渡す方法は？

Answer 1

HTTPを使用モジュールは、HTTPモジュールを有効にバックエンド

EG-

からデータを取得

app.module.tsする

import {HttpModule} from "@angular/http"; 

imports:[HttpModule] 

コンポーネントで

searchField: FormControl; 
coolForm: FormGroup; 

constructor(private service: Service){} 

this.searchField.valueChanges 
    .debounceTime(400) 
    .distinctUntilChanged() 
    .switchMap(term => this.service.getUser(term)) 
    .subscribe((result) => { 
    console.log(result); 
    this.result = result; 
    }); 

サービス

constructor(private http:Http) { } 

getUser(user:string){ 
    return this.http.get('https://api.github.com/users/'+user) // using git as reference 
    //you can also use your query params here 
     .map(response => response.json()); 
    } 

テンプレートあなたはこのlinkで同じの実施例を参照することができ

<form [formGroup]="coolForm"> 
    <md-input-container> 
    <input mdInput type="text" placeholder="Search Github Repo" formControlName="search"> 
    </md-input-container> 
</form> 

Githubの