聚合物1.0與文本區域的雙向綁定

Question

我有這個簡單的雙向數據綁定與textarea：

<dom-module id="my-element">
  <style>
  </style>

  <template>
    <button on-click="click">Click me!</button>
    <textarea>{{element}}</textarea>
  </template>
</dom-module>

<script>
  Polymer({
    is: "my-element",

    properties: {
      element: {
        type: String,
        value: "Default value",
        notify: true
      }
    },

    click: function() {
      console.log(this.element);
    }
  });
</script>

文本區域顯示為“默認值”。 當我更改此值然后單擊按鈕時，控制台仍注銷“ Default value而不是我剛剛輸入的文本。在這里，我做錯了什么？

Answer 1

您應該使用<iron-autogrow-textarea>允許數據綁定。

<dom-module id="my-element">
  <style>
  </style>

  <template>
    <button on-click="click">Click me!</button>
    <iron-autogrow-textarea bind-value="{{element}}"></iron-autogrow-textarea>
  </template>
</dom-module>

<script>
  Polymer({
    is: "my-element",

    properties: {
      element: {
        type: String,
        value: "Default value",
      }
    },

    click: function() {
      console.log(this.element);
    }
  });
</script>
</dom-module>

文檔在這里 。