創建具有自動完成

一個TextField我要創建一個文本字段與在灰燼自動完成對基於匹配每個按鍵獲取數據庫數據。創建具有自動完成

他們的任何內置小工具在Ember爲此？

2013-04-21 fortm

如果有人在尋找解決方案，下面是[embercast]（http://www.embercasts.com/episodes/building-an-autocomplete-widget-part-1）。 – Sisir 2014-12-18 16:44:39

Ember.js中沒有內置組件，但是根據經驗，這樣的組件可以非常容易地自行編寫。在EmberCamp Trek Glowacki表示，他希望不需要任何部件庫。

您還可以使用Twitter Bootstrap中的Typeahead或jQuery UI中的AutoComplete，它們可以一起工作。

來源

2013-04-22 00:46:07 Myslik

[Bootstrap Typeahead]（http://stackoverflow.com/questions/13637966/emberjs-data-source-twitter-bootstrap-typeahead） – pjlammertyn 2013-04-24 11:07:29

您可以使用Ember.Textfield的事件來做到這一點。（CoffeeScript的玉）

搜索查看

App.SearchView = Ember.View.extend 

    templateName: 'search' 

    searchTerm: null 

    searchTextField: Ember.TextField.extend 

     insertNewline: -> 
     # if the user hits the enter key, you can do something different or call the same function 
     @get('controller').search(@get('searchTerm')) 

     keyUp: (e) -> 
     # validate the item on every keypress 
     if (e.currentTarget.value.length > 0) 
      @get('controller').search(@get('searchTerm'))

搜索模板

script(type='text/x-handlebars', data-template-name='search') 

{{view view.searchTextField valueBinding="view.searchTerm" placeholder="search"}} 

<button {{action "search"}}>search</button>

搜索控制器

App.SearchController = Ember.ObjectController.extend 

    search: (searchTerm) -> 
    # do your search

**補充丟失的圓括號

來源

2013-04-22 22:40:21 WallMobile

會有一種很好的方法在搜索上添加300毫秒的延遲嗎？我正在過濾一個半大的DOM列表，我不希望Ember嘗試過濾輸入的字符。如果客戶正在嘗試輸入名稱。想象過濾之間的最小延遲可能會有所幫助。 – ootoovak 2013-05-26 21:12:16

是的，我可以很快將它添加到代碼中。但是，基本上，您可以在JavaScript中設置一個計時器來運行搜索功能，如果有另一個按鍵進入，您可以取消該計時器，然後設置另一個計時器。這樣，快速打字不會每次都會導致搜索，但打字時會打破x。 – WallMobile 2013-05-28 17:08:47

@ootoovak在調用'Ember.run.debounce'或Lodash的'_.debounce'時包裝'keyUp'的主體。 – Bluu 2013-10-07 19:34:10

EmberCasts有一個關於how to build an auto complete widget的好視頻。

I asked them about the millisecond delay關於過濾，我被告知他們會在下一集中對它進行說明。

來源

2013-05-26 21:18:16 ootoovak

這太糟糕了EmberCasts似乎沒有添加新視頻，您提到的那個視頻很快且很容易實現，謝謝。 – 2014-04-08 16:40:26

The github project ember-typeahead在這方面也取得了良好的開局。

來源

2014-01-14 22:26:28 bk11425

創建具有自動完成

回答

相關問題