0

次の検索入力フィールドを含むハンドルバー ビューがあります。

{{view Ember.TextField valueBinding="controller.query" action="submit"}}

ユーザーが検索入力フィールドから「Enter」を押すと、外部 API を呼び出し、応答を取得し、それに応じて結果をクエリします。コントローラの（簡略化された）バージョンのコードは次のとおりです。

App.ProductsController = Ember.ArrayController.extend({
  submit: function(query) {
  // call to external api
  // get response
  // update some values
  }
});

「Enter」の代わりに keyUp イベントで「submit」機能をトリガーするにはどうすればよいですか? つまり、ユーザーが入力フィールドに文字を追加または削除するたびに、コントローラーの「送信」機能を再実行できますか?

4

2 に答える 2

0

使用する場合

ハブ:

{{view Ember.TextField valueBinding="controller.query"
                       action="submit" class="my-input"}}

keyUp次に、ビューでイベントにサブスクライブする必要があります。イベントはビュー全体で発生するため (この場合、このタイプのイベント、入力、編集可能なコンテンツなどをビュー内でサポートする要素に対してのみ)、探している入力を確認する必要があります。

js:

App.ProductsView = Ember.View.extend({
  keyUp: function (e) {
    if ($(e.target).hasClass('my-input')) { // you can use other identifier
      this.get('controller').submit(e.target.value);
    }
  }
});

Ember.TextField別のアイデアは、クラスを拡張することです:

ハブ:

{{view App.ProductTextField valueBinding="controller.query"
                            action="submit"}}

js:

App.ProductTextField = Ember.TextField.extend({
  keyUp: function (e) {
      this.get('controller').submit(e.target.value);
  }
});

実際には、ビューからメソッドにパラメーターを渡す必要はありません。コントローラーには、この情報が変数submitで既に最新になっているためです。query

于 2014-01-18T10:14:40.653 に答える
0

これで行くと、追加できると思います

keyUp: function(evt) {
  this.get('controller').send('submit'); 
}

または多分

keyUp: function(evt) {
  this.get('controller').send('submit', this.get('controller.query')); 
}

あなたのビュー（またはビューを拡張するEmber.TextField）に。

別の可能性は で動作する可能性がありますが、それをヘルパー{{action "submit" controller.query on="keyUp"}}と組み合わせる方法がよくわかりません。{{view}}

于 2013-04-04T08:38:52.757 に答える