0

I have been having some scope issues when developing a Polymer app. Essentially I am attempting to use custom elements as classes containing pertinent logic.

Say I have a listener that is listening for a click event on a custom-elem element, and I want to access a function in another element, in this case the elements parent, parent:

<polymer-element name="custom-elem">
  <template>
  </template>
  <script>
     Polymer({
        attached: function(){
               this.addEventListener('mousedown', function(e) {
                    if (e.which === 1){
                      this.parentNode.parentNode.testFunc(e);
                      //or this.parentNode.querySelector.... etc
                    }
                    else if (e.which === 3){
                    }


                }.bind(this));
}
</script>
</polymer-element>

I find I have to traverse the DOM to find the element I am looking for, or create a reference in a newly created element. I realize I could create an object in an external script that contains logic above, but that seems to invalidate the purpose of defining custom elements / web components.

Is there anyway to easily access members of Polymer registered elements without navigating the DOM and without creating external scripts?

andrsnn
  • 1,591
  • 5
  • 25
  • 43
  • I'm thinking adding references on element creation to an object as the only solution to this problem. Like [here](http://stackoverflow.com/questions/881515/how-do-i-declare-a-namespace-in-javascript) – andrsnn Jan 03 '15 at 05:55

1 Answers1

1

I think you'll have an easier time if you reconsider your approach to be more along the lines Polymer was designed for. This may help - https://stackoverflow.com/a/23963632

Community
  • 1
  • 1
sfeast
  • 956
  • 5
  • 7