繁体   English   中英

从ember组件冒泡出事件

[英]Bubble up events from ember component

我创建了一个呈现html文本并处理点击事件的组件。

Ember Components并没有冒泡活动,但我想让点击链接冒泡到窗口,让浏览器处理它。

代码告诉超过1000字:-)

HTML

  <script type="text/x-handlebars" data-template-name="application">
      <h1>Click the link in the following div</h1>
      {{outlet}}
  </script>
  <script type="text/x-handlebars" data-template-name="index">
      {{test-a}}
  </script>
  <script type="text/x-handlebars" data-template-name="components/test-a">
    <div class="index" {{action 'edit' on="click"}}>
        <a href="http://www.example.com" target="_blank">Click me</a>
    </div>
  </script>

咖啡

App = Ember.Application.create({});

App.TestAComponent = Ember.Component.extend
    actions:
        edit: ->
            if event.toElement.nodeName.toUpperCase() == 'A'
                return true # should bubble to the window but is a component
            # do something for editing here
            alert('div clicked')
            false

CSS

h1 { font-size: 1.6em; padding-bottom: 10px; }
h2 { font-size: 1.4em; }
ul { padding: 15px; font-size: 1.4em; color: green; }
.index { background-color: #666; padding: 20px; }

小提琴: http//jsfiddle.net/ujrZL/

创建组件时,设置应使用sendAction传播的操作的操作名称。

{{test-a internalAction='myAction'}}

{{test-a internalAction='myAction2'}}

并从组件内部

 this.sendAction('internalAction'); 

http://emberjs.jsbin.com/oPAtORO/2/edit

我正在使用一种可能是当前唯一方法的解决方法。 我不喜欢它,因为它对我来说有点味道。

CoffeeScript的

actions: ->
    edit: ->
        window.open event.toElement.href, '_blank'

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM