using polymer with typescript

Question

i have created files:

card.html:

<polymer-element name="card" constructor="Card">
  <template>
    <link rel="stylesheet" href="card.css">
    <content></content>
  </template>
  <script src="card.js"></script>
</polymer-element>

card.js:

class Card {

    ready() {
    }

    leftView() {
    }
}

I'm trying to use polymer with typescript, as i understand class Card should extend Polymer class which extends Node just don't understand how to do .

Answer 1

Your TypeScript (should be card.ts, not card.js) could look like this:

class Card extends HTMLElement {
    ready() {
        alert("made a card");
    }
}

Polymer('x-card', Card.prototype);

Note: if you put code in a constructor method, it will never run (because of arcana in the way custom elements are marshaled at the browser level).

You will have to compile your typescript into javascript to try it. Also, remember that custom element names must contain a dash, so:

<polymer-element name="x-card" constructor="Card">