2017-10-03 10 views
1

<paper-input>フィールドにテキストを入力してオブザーバをトリガーしたいとします。Observerがポリマー2.xの<paper-input>に応答していない

郵便番号のフィールドにテキストを入力するとき、私は入力されたテキストがコンソールに記録されることを期待します。代わりに、コンソールに何も表示されません。

私は間違っていますか?

Here is the JSbin Demo.

http://jsbin.com/xahobojixe/1/edit?html,console,output
<!DOCTYPE html> 
<html> 

    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bin</title> 

    <base href="//polygit.org/polymer+:master/components/"> 
    <script src="webcomponentsjs/webcomponents-lite.js"></script> 
    <link rel="import" href="polymer/polymer-element.html"> 
    <link rel="import" href="paper-input/paper-input.html"> 

    </head> 

    <body> 

    <dom-module id="my-el"> 
     <template> 
     <paper-input label="simple character counter" char-counter value="{{zipCode}}"></paper-input> 
     [[zipCode]] 
     </template> 

     <script> 
     class MyEl extends Polymer.Element { 
      static get is() { 
      return 'my-el'; 
      } 

      static get properties() { 
      /**/ 
      return { 
       properties: { 
       zipCode: { 
        type: String, 
        notify: true, 
        observer: '_zipCodeChanged', 
       }, 
       }, 
      }; 
      } 

      constructor() { 
      super(); 
      } 

      /**/ 
      ready() { 
      super.ready(); 
      } 

      _zipCodeChanged(s) { 
      console.log('zip-code', s); 
      console.log('zip-code-this', this.zipCode); 
      } 

     } 

     window.customElements.define(MyEl.is, MyEl); 

     </script> 
    </dom-module> 

    <my-el></my-el> 
    </body> 

</html> 
+0

zipCcode'がproperties' 'のサブプロパティである'ので、あなたは、複雑な観測が必要になります。 – Ofisora

答えて

2

それはpropertiesという名前のプロパティが含まれているとして、あなたのpropertiesゲッターは、間違って見えます。ゲッターは次のようになります。

static get properties() { 
    return { 
    zipCode: { 
     type: String, 
     notify: true, 
     observer: '_zipCodeChanged', 
    }, 
    } 
} 

updated jsbin

関連する問題