角度2のコンポーネントを更新または再読み込みするにはどうすればよいですか？

Question

私は現在、角度2で働いています。ここで私は興味深い問題に直面しています。私は「resultsComponent」に私をリダイレクトする私のヘッダー内の検索バーを持っています。 resultsComponentに検索結果が表示されます。しかし、ときに私はresultsComponentに立って何かを検索したいのです。検索バーで検索するものを入力すると、既にそのコンポーネントに入っているため、リダイレクトされません。原因これにresultsComponentのコンストラクタは再びヒットしません。私はコンストラクタでクエリ値を取得しているので、私はクエリ値を取得できません。どのように私はこのコンストラクタをリロードすることができます。ここに私のコードサンプルです。 HeaderSearch

<input type="search" name=query [(ngModel)]="query" #quer="ngModel" class="form-control" class="form-control" required> 
           <button type="submit"(click)="Search()" class="btn"> 
            <i class="icon icon-header-search"></i> 
           </button> 

と.TS

Search(){ 
// alert(this.query) 
//console.log(this.query); 
     localStorage.setItem('val',JSON.stringify(this.query)); 
this.router.navigate(['/result']); 

     } 

とresult.ts

constructor() { 
    this.query=JSON.parse(localStorage.getItem('val')); 
    } 

this.httpService.searchGeneric(this.query,1).subscribe(
     data => { 
     this.Getspecs = data; 
    this.count=data['totalItems']; 
     } 
    ); 

私は結果のコンポーネントの上に立っています。どのように私の検索は、私が再びそれを検索するたびに、私の結果コンポーネントを更新し、更新することができますを伝えることができます。どんな助けや提案も高く評価されます。

Answer 1

私は出発点であなたを助けることができます。 ヘッダー検索コンポーネントで、結果コンポーネントのビューチャイルドを定義します。あなたは、コンストラクタでやっているすべてのものを行いますメソッドを定義componant結果で 、単にコンストラクタで依存関係injectiomを保ちます。今、検索ボタンを押す上の

は、検索方法は、結果のコンポーネントメソッドを呼び出すと、すべてが更新されますviewchildオブジェクトを使用して、この方法では、ヘッダ検索componantに呼び出されます。以下にいくつかのサンプルコードです：

検索コンポーネント：

@ViewChild(ResultsComponent) resultsComponent: ResultsComponent; 

Search(){ 
    // alert(this.query) 
    //console.log(this.query); 
    localStorage.setItem('val',JSON.stringify(this.query)); 
    this.router.navigate(['/result']); 
    resultsComponent.open(); 
} 

は結果コンポーネント：

constructor() { 
} 

open() { 
    this.query=JSON.parse(localStorage.getItem('val')); 
    this.httpService.searchGeneric(this.query,1).subscribe(
    data => { 
     this.Getspecs = data; 
    this.count=data['totalItems']; 
    } 
); 
}