Brad
Brad

Reputation: 41

Polymer: listen for an external event

We're introducing Polymer 1.0 components into a legacy system written in vanilla JS. Some of the new components will need to play nice and interact with the existing logic. Because we don't have the freedom to componentize (Polymerize) the entire application 'the polymer way', we're running into some challenges with respect to event handling/message passing.

For example, let's say there is a page with a todo selector written in vanilla JS, and a detail component written in Polymer. In addition, the todo selector is a sibling to the Polymer detail component. When a user checks a todo, the associated polymer component will display a tab that includes that todo's details. If multiple todos are checked, multiple tabs will be displayed. Likewise, if a tab is closed, the associated todo on the selector will become unchecked (two-way communication will be necessary).

What is the best way to attach an event listener to the Polymer detail component that can respond to 'external' events dispatched from the selector? For the other direction, I believe we can 'fire' an event from the Polymer component.

Upvotes: 0

Views: 495

Answers (1)

Pascal Gula
Pascal Gula

Reputation: 1173

You can specify a list of listeners that your component react to:

  listeners: {
    // `click` events on the host are delegated to `tapHandler`
    'tap': 'tapHandler'
  },

More information in the proper Documentation section

Upvotes: 1

Related Questions