Twitter Typeahead自定义事件未触发

时间:2014-06-13 17:11:41

标签: javascript angularjs coffeescript twitter-typeahead

我正在开发一个自定义的Angular.js指令来包装Twitter Typeahead。降压功能似乎工作得很好,但是没有一个自定义事件似乎完全触发。我正在使用Angular 1.2.6,Twitter Typeahead 0.10.2和jQuery 1.10.2。以下是我的代码的几个片段:

搜索-doctors.html

<div class="controls">
    <div class="span11 input-append">
        <input type="search" class="span10" name="practiceName" ng-model="message.practiceName" required typedown="contactDoctors" />
        <span class="add-on search-glass"><i class="fa fa-search"></i></span>
    </div>
</div>

typedown.coffee

angular.module('someApp')
  .directive('typedown', ->
    restrict: 'A'
    link: (scope, element, attrs) ->
      element.typeahead({
        name: attrs.typedown
        source: (query, cb) ->
          # Ultimately, this will call to a service that will return the array of
          # search results, but for simplicity's sake, I'm stubbing some dummy data.
          cb ['Neurocare of Scottsdale', 'Neurocare of Tempe']
      })
      # These never seem to get fired, despite following the instructions in
      # typeahead's documentation
      .on 'typeahead:opened', ->
        alert 'opened'
      .on 'typeahead:autocompleted typeahead:selected', (event, query) ->
        alert query
)

打字实际上似乎在UI上工作。当我在搜索框中输入'neuro'时,我得到了预期的行为,但当我点击标签或点击选项自动完成时,相应的事件处理程序不会触发。此外,当我开始输入并打开打字输入时,预期的typeahead:opened事件未触发。

在调用指令元素上的typeahead之前,我尝试将事件绑定到元素。我也尝试使用bind代替on(虽然这不应该有任何影响)。无论如何,我已经没有时间和想法来完成这项工作。我很想得到一个快速的理智检查和一些额外的目光,看看是否有我缺少的东西。

提前致谢!

1 个答案:

答案 0 :(得分:0)

在花了几天时间研究其他事情之后,我回到了我身边。我突然想到,因为我已经在使用 Bootstrap 2.3.2 ,包括 Twitter Typeahead 可能会导致与管理$.fn.typeahead的脚本冲突。我设法通过删除Twitter Typeahead并依赖于Bootstrap 2.3.2中内置的遗留实现来实现它。我最终会升级到Bootstrap 3,但现在这个版本有点高,而且该项目将用于医院,这在医学界已经远远落后于其他人。