Javascript 在Ember.js中重新创建引导下拉功能

编辑：正在寻找在单击按钮以外的任何内容时关闭下拉列表的方法：

我希望在我的余烬应用程序中（重新）创建twitter的下拉菜单。我在尝试关闭下拉列表时遇到了一个问题，除了单击下拉列表外，其他任何内容都被单击。例如，我正在寻找一种方法，将事件侦听器添加到我的应用程序中，以便在单击应用程序主体时关闭下拉列表

这是我（孩子）的看法

这是我的模板代码

{{#view categorySelect tagName="div" class="btn-group" classBinding="isOpen:open"}}
                        <a class="btn dropdown-toggle btn-facebook btn-small" {{action "dropdownToggle" on="click"}} href="#">
                            {{selected.title}}
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu pull-right">
                            {{#each content}}
                            <li {{bindAttr class="isActive:active"}}><a href="#" {{action "select" on="click"}}>{{title}}</a></li>
                            {{/each}}
                        </ul>
                    {{/view}}

---

寻求帮助和建议。此外，如果上面的任何代码看起来像垃圾，请告诉我，我希望尽可能多地学习。

我的设置与您大致相同，它通过使用didInsertElement在body元素上创建事件侦听器来工作

唯一的区别是我在dropdownToggle中有一个e.stopPropagation（）调用：

dropdownToggle: function(e){
    // [removed]
    e.stopPropagation();
},

没有这一行，我无法保持下拉列表打开，因为单击下拉列表会传播到身体并立即关闭它

在我的设置中，单击视图会传播到主体（因此上面的代码），单击其他视图会触发主体上的事件侦听器

我猜你在其他视图中有一些代码阻止了向身体的传播

---

举个例子。

我修改了你的小提琴：

---

这对我有用。刚刚删除了“dropdownToggle”的操作帮助程序，并将数据属性添加到a标记，并为“categorySelect”视图添加了“dropdown”类

也许，您可以看看这里做了什么，谢谢@jrabary。我在发布之前就看过了，但不幸的是，他们还没有实现下拉列表。我会密切关注的，以防他们将来会这样做……谢谢你，老兄。不知道为什么我从来没想过。现在看起来像是个哑巴。不管怎样，对其他人来说。。。工作的js小提琴在这里：人力资源管理。。。在我的应用程序中似乎仍然失败。花了一个小时调试，直到我放弃并升级到ember 0.9.8.1，它似乎解决了我的问题。

didInsertElement: function(){
        var self = this;
        $('body').on('click', function(){
            self.set('isOpen', false);
        });
    },

dropdownToggle: function(e){
    // [removed]
    e.stopPropagation();
},