polymerpolymer-1.0paper-elementspolymer-starter-kit

How to implement MVC pattern in Polymer 1.0?


Can we define controller for polymer element? For example, I have a ListView as element.Now I want to implement onClickEvent() in controller to keep business / other logic separate from View. So is there any View-Controller binding available in polymer.?


Solution

  • The basic structure of a Polymer element embeds the MVC solution for you, doesn't it?

    For example, the general structure is:

    <dom-module id="my-module">
      <!-- Imports go here -->
      <link rel="import" href="../bower_components/example-imported-element/example-imported-element.html">
      <style>
        ...
      </style>
      <template>
        <paper-button on-click="myFunc"></paper-button>
      </template>
      <script>
        (function() {
            Polymer({
              is: "my-module",
              ...
              myFunc: function() {
                // Do stuff
              },
              ...
            });
          }()
      </script>
    </dom-module>
    

    So your "model" is your Shadow DOM, everything inside your <template> tags are your "views" and everything inside your Polymer() function is your "controller" isn't it? (Even thought it's not formally labeled that way.) Or did you have something else in mind?