创建聚合物自定义元素的自定义事件

Question

我一直在尝试创建一个事件来触发给定某些条件（更一般的情况下），但我还没有找到一种方法，至少不是在官方文档中聚合物处理事件

https://www.polymer-project.org/0.5/articles/communication.html

的自定义元素听另一个事件，所以他需要一个条件得到满足扔内部事件。

这是一个小的描述例如：

的Index.html

... 
<my-element></my-element> 
... 
<script> 
    var ele = document.querySelector("my-element"); 
    ele.addEventListener("myCustomEvent", 
       function(){ 
        // some action 
        ... 
      }) 
</script> 

这个代码描述谁将会听取事件（ “myCustomEvent”）和动作被引爆。

---

另一方面而来的自定义元素的实施

<polymer-element name="my-element"> 
    <template> 
     <other-custom-element id="foo"></other-custom-element> 
    </template> 
    <script> 
    Polymer("my-element", { 
     ready: function(){ 
     var foo = this.$.foo; 
     foo.addEventListener("AnotherEvent" , function(){ 
      ... 
      if(condition){ 
       ... 
       // in this part I need to fire the event 
       // "myCustomEvent" 
      } 
     }) 
     } 
    }) 
    </script> 
</polymer-element> 

我的问题是触发事件时的条件已经完了，外面听该事件（在的index.html）

参考

1. https://www.polymer-project.org/0.5/articles/communication.html
2. https://www.polymer-project.org/0.5/docs/polymer/polymer.html#fire

Answer 1

试试这个。 （注意：更改的事件名称不区分大小写['AnotherEvent' - >'another-event']，因为HTML更快乐）：

<polymer-element name="my-element"> 
    <template> 
     <other-custom-element on-another-event="{{doAnotherEvent}}"></other-custom-element> 
    </template> 
    <script> 
    Polymer("my-element", { 
     doAnotherEvent: function(){ 
     if (condition){ 
      // in this part I need to fire the event 
      // "my-custom-event" 
      this.fire('my-custom-event'); 
     } 
     } 
    }); 
    </script> 
</polymer-element>