Ember.js v1.2.0-Ember.组件未点火'；单击'；处理程序，为此返回null。$（）

我正在使用

Ember v1.2.0

以及

Handlebars v1.0.0

和

jQuery v2.0.2

，我开始使用

Ember.Component

并替换我通过组件创建的一些视图（例如自定义下拉元素），感觉这是正确的做法，但不幸的是，它没有像我预期的那样工作

这是我的

把手
文件，位于“模板/组件/my”下拉列表下：

<div class="dropdown__header" {{action 'toggle'}}>
    <i {{bind-attr class=view.iconClass}}></i>{{view.displayText}}
</div>
<div class="dropdown__caret"></div>
<ul class="dropdown__body">
  {{yield}}
</ul>

这是
Ember.Component
的预期行为吗？
您的组件名称与模板不匹配，您需要更改为
App.MyDropdownComponent
。谢谢@MárcioRodriguesCorreaJúnior-我只是在这里从头开始写代码，没有意识到我使用了错误的名称。。。我将更新线程，使其符合命名约定。然而，这种行为仍然是一样的…：（，您能告诉我们您是如何使用它的吗？它在jsbin中似乎运行正常。
App.MyDropdownComponent = Ember.Component.extend({
  classNames: 'dropdown'.w(),

  toggleList: function () {
    //var $this = this.$(); // returns null (!!!)
    var $this = this.$('.' + this.get('classNames').join(' .')); // returns the expected object
    if($this.hasClass('open')) {
      $this.removeClass('open');
    } else {
      $this.addClass('open');
    }
    // Note: I can't work with classNameBindings and toggleProperty() because the classes
    // could also be accessed through other code...
  },

  click: function (event) {
    alert('heureka!'); // never fired!
  },

  actions: {
    toggle: function () {
      this.toggleList(); // fired as expected
    }
  }
});