2016-11-21 1 views
0

ユーザーの検索クエリでAngular2アプリケーションで結果が見つからない場合は、「結果が見つかりません」というメッセージが表示されます。また、検索クエリの評価自体に遅延が設定されているため、この問題が発生するのを遅らせようとしています。クエリの遅延が発生する間に、「結果が見つかりません」というメッセージが1ミリ秒間画面に表示されます。クエリが評価されている間に「結果が見つかりません」というメッセージが表示されなくなり、実際に結果が見つからない場合は再び表示されます。したがって、問題は、クエリに設定された遅延のために、画面にメッセージがミリ秒で印刷されることがあります。私はこのように、遅延を一致させるためにタイムアウトに機能をラップ試してみました:「結果が見つかりません」と入力する前に遅延を作成する

setTimeout(noResultsFound, 2000); 

    noResultsFound(): boolean 
    { 
     if (this.query && !this.hasResults) { 
     return true; 
    } 

そして、私のビューのコードは次のようである:

<div *ngIf="inputHasFocus && noResultsFound" class="no-results-found">No Results Found</div> 

しかし、それは働いていない、と私は取得していますエラーメッセージ "関数の宣言は私の 'setTimeout"となります。 Typescriptではこれができないのでしょうか?代わりがありますか?私はここで何が欠けていますか?

答えて

0

このコード:

setTimeout(noResultsFound, 2000); 
noResultsFound(): boolean 

は間違っていくつかのことを持っている:

  • noResultsFoundはグローバルではありません。そのクラスメンバー。したがって、thisが必要です。 setTimeout(this.noResultsFound, 2000);
  • thisを使用する場合は、その問題(JavaScriptのこと)に気づく必要があります。矢印をおすすめしますnoResultsFound(): booleannoResultsFound =(): boolean =>になります。 More:https://basarat.gitbooks.io/typescript/content/docs/arrow-functions.html
  • デバウンスにはsetTimeoutを使用しないでください。より良い機能的アプローチを使用してください。 underscore.debounce

希望します。

+0

フィードバックありがとうございます。したがって、遅延の問題を無視して、このコードは動作します。 public get noResultsFound():boolean { if(this.query &&!this.hasResults){ return true; } } このような状況で遅延を作成することをおすすめしますか? – Muirik

関連する問題