Question

我正在制作一个非常简单的Ember APP。为了我自己的理智，我更喜欢在EmberViews中通过jQuery进行必要的动画和简单的dom事件，例如鼠标悬停/点击。

假设我有这个：

App.SomeView = Ember.View.extend({

     didInsertElement:function(){
       this.$(element).hover(function(){
                 $(anotherElement).toggle();
       });
     }

});

我的模板是这样的：

<script type="text/javascript" data-template-name="routeName">
   {{#view SomeView}}
      <button {{action 'something' this}}>    </button>
      <element></element>
       {{#if condition}}
        <anotherElement></anotherElement> 
       {{/if}}
  {{/view}}
</script>

我的控制器相应地支持这样的动作：

App.SomeController = Ember.Controller.extend({
  condition:false,
  actions:{
    something:function(){
      this.set('condition',true);
    }
  }
});

一切都很好，但我希望“某些”操作要在我的视图中触发' didInsertElement '事件，以便' anotherElement “可见性被切换，而我不必再次写下该代码。

这有什么意义吗？我尝试使用'observables'，但无法让它们工作。

或者，如果有更好的方法可以做到这一点，也欢迎这些。

Answer 1

您可以在视图中定义执行所需操作的操作，并指定操作的目标作为视图。

<button {{action 'something' target="view"}}></button>

在您看来，

App.SomeView = Ember.View.extend({
  ...

  actions: {
    'something': function() {
      // Do whatever you want.     
    }
  }
});

通过EmberJS操作触发jQuery DOM操作事件

1 个答案: