[英]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');
我正在使用一種可能是當前唯一方法的解決方法。 我不喜歡它,因為它對我來說有點味道。
CoffeeScript的
actions: ->
edit: ->
window.open event.toElement.href, '_blank'
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.