Question

Handlebar条件实际上删除了条件中的DOM元素，JQuery认为新生成的DOM元素尽管它们匹配的ID或类是完全不同的。

我需要一个简单的解决方案。我可以在每页包装一次解决方案的解决方案。我并不想在所有事情之后将.observes（）视为一种伪劣的解决方案

现在我将我的Jquery放在当前正在使用的视图中的didInsertElement {}中。

简单示例：

exampleView -

didInsertElement {
  $('#exampleButton').on('click', function() {
    console.log('To Ember. Or to Angular. That is the question.')
  }
}

example.hbs -

{{#if booleanTrue}}
  <button id="exampleButton">Button go!</button>
{{/if}}

Answer 1

对于Ember来说，这种方法并不是最好的方法。对于Ember的未来版本，他们正计划删除jQuery依赖项。使用Ember，您不必使用jQuery。

像这样重写你的代码：

didInsertElement: function(){
  this.$().hide().fadeIn('slow'); // or any animation that you want
},
actions: {
  myButtonAction: function(){
    //do something
  }
}

{{#if booleanTrue}}
  <button id="exampleButton" {{action "myButtonAction"}}>Button go!</button>
{{/if}}

willDestroyElement不是动画的右钩子。所以你必须自己触发它。我使用自定义操作，如

actions: {
  deleteClicked: function(){
    var self = this;
    this.$().animate({ height: 'toggle' }, 300, function() {
      self.set('booleanTrue', false);
    });
  }
}

由于你的评论，我改变了我的回答

Emberjs - Ember条件打破了Jquery。需要简单的修复

1 个答案: