纸张自动完成验证不起作用

Question

我正在研究基于 聚合物 的前端项目。我对这类事情很陌生，我正在努力寻找我需要的组件的信息和工作示例。我知道有这些组件的演示展示，但它们没有提供我需要的东西。

  <iron-form id="formForm">
      <form>
        <paper-autocomplete label="Country" required error-message="This field is required"></paper-autocomplete>
      </form>
  </iron-form>

当我在 <iron-form> 中使用 paper-autocomplete 元素并向其添加 required 属性时，<iron-form> 调用 paper -autocomplete 验证器。但是当我创建自己的 polymer 元素时，它只包含 paper-autocomplete，当我将它包含在里面时，铁形式看不到它。

这是我的自定义聚合物元素

<link rel="import" href="../../../bower_components/polymer/polymer.html">
<link rel="import" href="../../../bower_components/iron-ajax/iron-ajax.html">
<link rel="import" href="../../../bower_components/paper-autocomplete/paper-autocomplete.html">
<link rel="import" href="../globals-behavior.html">

<dom-module id="autocomplete-country">
  <template>
    <iron-ajax id="countryFindCall"
        url="{{restUri}}/classifier/country/find"
        params="{{query}}"
        on-response="handleResponse"
        debounce-duration="300"></iron-ajax>

    <paper-autocomplete label="Country" id="country-autocomplete" remote-source="true" min-length="2"
        text-property="label" value-property="value" disable-show-clear="true"></paper-autocomplete>
  </template>

  <script>
    Polymer({
      is: "autocomplete-country",

      behaviors: [
        GlobalsBehavior
      ],

      properties: {
        item: {
          notify: true
        },

        query: {
          type: Object
        },

        result: {
          type: Object
        },

        selected: {
          type: Object,
          value: {}
        }
      },

      attached: function() {...},
      handleResponse: function (data) {...},
      onSelect: function(event) {...},
      onChange: function(event) {...},
      onBlur: function() {...} 
    });
  </script>
</dom-module>

这就是我包含它的方式

  <iron-form id="formForm">
      <form>
        <autocomplete-country item="{{request.country}}" required error-message="Field is required"></autocomplete-country>
      </form>
  </iron-form>

Answer 1

摘自 iron-form 文档：
<iron-form> 是一个 HTML <form> 元素，可以验证和提交任何实现 Polymer.IronFormElementBehavior 的自定义元素。
所以我想你的元素应该实现它，你很高兴。

Answer 2

通过添加新参数 required 并将其添加为属性解决了此问题：

<paper-autocomplete ... required$="[[required]]" ... ></paper-autocomplete>

纸张自动完成验证不起作用

paper-autocomplete validation is not working

validation

polymer

paper-elements

custom-element