Как улавливать, что ввод нажат в бумажном вводе Polymer 1.0

Question

Как поймать, когда введите прессован в Polymer 1.0 paper-input?

Я попытался с on-bind-value-changed, подверженной через iron-input, но мне кажется, что отличает только с буквами аргумента события, где e.detail является null на всех других ключей, таких как введите, вкладку и т.д.

Answer 1

Я бы привязал событие keydown к входу, называемому функцией. Там вы можете найти, какой ключ был нажат. Например:

<dom-module id="test-element"> 
    <template> 
     <!-- add keydown listener to paper input --> 
     <paper-input label="Input label" on-keydown="checkForEnter"></paper-input> 
    </template> 
    <script> 
     Polymer({ 
      is: "test-element", 
      checkForEnter: function (e) { 
       // check if 'enter' was pressed 
       if (e.keyCode === 13) { 
        // enter pressed! 
       } 
      } 
     }); 
    </script> 
</dom-module> 

Answer 2

Другой возможностью было бы использовать iron-a11y-keys. Таким образом, вы можете декларативно определить, что происходит, когда пользователь нажимает клавишу enter, в то время как фокус находится на элементе paper-input.

Пример (копируется из каталога Polymer):

<iron-a11y-keys id="a11y" target="[[target]]" keys="enter" 
       on-keys-pressed="onEnter"></iron-a11y-keys> 
<paper-input id="input" placeholder="Type something. Press enter. Check console." value="{{userInput::input}}"></paper-input> 

После этого, вы должны связать target свойство a11y элемента к paper-input элемента, например, так:

... 
properties: { 
    userInput: { 
    type: String, 
    notify: true, 
    }, 
    target: { 
    type: Object, 
    value: function() { 
     return this.$.input; 
    } 
    }, 
}, 
onEnter: function() { 
    console.log(this.userInput); 
} 
... 

Надеюсь, это поможет. См. iron-a11y-keys для получения дополнительной информации.