2016-04-08 4 views
0

e.target veri kümesini ve öznitelikleri bağlayan öğe olmadığından, olay işleyicide veri kümesi alma yönteminin farklı olması nedeniyle, kendi polimer öğemde "kağıt girişi" ve "kağıt düğmesi" kullandım. Polimer elementin veri kümesini veya niteliklerini elde etmenin ortak bir yolu var mı?Polimer elemanının veri kümesini veya özelliklerini almanın ortak bir yolu var mı?

<dom-module id="login-form"> 
<template> 
    <div> 
     <form action="/login" method="POST"> 
      <paper-input id="username" > 
       <paper-icon-button on-click="clearInput" data-elmid="username" suffix > 
       </paper-icon-button> 
      </paper-input> 

      <paper-button class="custom indigo" data-hello="world" on-click="loginValidate"> 
       Login 
      </paper-button> 
     </form> 

    </div> 
</template> 

<script> 
    (function() { 
     Polymer({ 
      is: 'login-form', 
      clearInput: function(e) { 
       console.log(e.target.dataHost.dataset.elmid); 
      }, 
      loginValidate: function(e) { 
       console.log(e.target.dataset.hello); 
      } 
     }); 
    })(); 
</script> 
</dom-module> 

cevap

2

Bağlamanız biraz yanlış görünüyor.

bir data- niteliği bağlamak ve dataset özelliği ile erişmek mümkün, data-foo$=value [*] içinde $= kullanın. Aksi takdirde, Polimer, özniteliği eleman üzerindeki bir camelCase özelliğine dönüştürür (yani data-foo=10'a element.dataFoo tarafından erişilirken, data-foo$= element.dataset.foo olur). Örneğinizde, Polymer, <paper-input> üzerinde dataElmid özelliği ve <paper-button> üzerinde oluşturdu.

<paper-input id="username"> 
    <!-- change `data-elmid="username"` to `data-elmid$="username"` --> 
    <paper-icon-button on-click="clearInput" data-elmid$="username" suffix > 
    </paper-icon-button> 
</paper-input> 

<!-- change `data-hello="world"` to `data-hello$="world"` --> 
<paper-button class="custom indigo" data-hello$="world" on-click="loginValidate"> 
    Login 
</paper-button> 
: Burada

düzeltilmiş örnek