Emberjs + Handlebars +对象onchange和事件

时间:2012-02-26 22:50:29

标签: ember.js handlebars.js

我发现jQuery观察者没有绑定到手柄逻辑中没有显示的元素。

假设我有以下内容;

{{#if person}}
  Welcome back, <b>{{person.firstName}} {{person.lastName}}</b>!
{{else}}
  Please <a class="login">log in</a>.
{{/if}}

<script>
$('.login').click(function() {
    alert("Hi there.");
});
</script>

如果我在控制台中运行,person = null(或说服该人为空所需的任何内容) - 登录观察者不起作用。我已经使用余烬didInsertElement()来加载其他一些东西,但是我可以挂钩进入“onChange”事件,以便重新绑定事件观察者吗?

2 个答案:

答案 0 :(得分:1)

最大的问题是为什么你想要那个? Ember具有出色的内置支持点击处理程序,无需通过jQuery。您<script>无法正常工作的原因很可能是ember将视图插入DOM的延迟方式。当您执行Ember.View.append()时,元素将在以后插入DOM中。

那就是说,这是一个小提琴,我想你想在didInsertElement()中附加jQuery点击处理程序。

http://jsfiddle.net/algesten/5LPPz/1/

didInsertElement: function () {
    // appending click handler directly with jQuery
    $('.login').click(function() {
        alert("Hi there.");
    });
}

然而,ember方式只是使用click隐式处理函数:

http://jsfiddle.net/algesten/5LPPz/2/

click: function () {
    alert("Hi there.");
}

N.B。后一个处理程序附加到周围的车把div而不是a,但是点击了气泡。

答案 1 :(得分:1)

你面临的问题是javascript只能绑定到dom中存在的元素。添加新元素后,它希望您重新绑定这些事件。幸运的是,jQuery是你的朋友。

<script>
$('body').on('click', '.login', function() {
    alert("Hi there.");
});
</script>

理想情况下,您的选择器是.login最接近jnt的父级。如果您不确定

,以上是安全的选择