我正在研究基于聚合物的前端项目 . 我正在努力寻找我需要的组件的信息和工作示例 . 我知道有这些组件的演示展示,但他们没有给我我需要的东西 .
<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验证器 . 但是当我创建自己的聚合物元素时,只包含纸张自动完成,当我将其包含在里面时,铁形态看不到它 .
有我的定制聚合物元素
<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>
2 回答
取自铁形文件:
<iron-form>
是一个HTML<form>
元素,可以验证和提交实现Polymer.IronFormElementBehavior的任何自定义元素 .所以我想你的元素应该实现,你很高兴 .
通过添加新参数 required 并将其添加为属性解决了此问题: