MaterialInputComponent
Selector: <material-input:not(material-input[multiline])>
material-input是单行或多行文本字段,用户可以在其中输入。 它有可选的标签。注意:客户端必须在其指令列表中声明materialInputDirectives而不是MaterialInputComponent。
Attributes:
- type - 输入的类型。 默认为“text”。 其他支持的值是“email”,“password”,“url”,“number”,“tel”和“search”。 (输入类型“number”也使用materialNumberInputDirectives)
- multiple - 用户是否可以输入多个值,以逗号分隔。 此属性仅在type =“email”时适用,否则将被忽略。
- role - input元素的role属性。
Inputs:
- characterCounter (String) → int 自定义字符计数器功能。
键入输入文本; 返回文本应被视为多少个字符。
- checkValid (String) → String
已禁用!请改用angular2 forms API
- disabled bool
是否禁用此输入(只读输入)
- displayBottomPanel bool
是否显示错误,提示文本和字符计数器面板。
- error String
显示错误。比此输入上可能存在的所有其他错误更高的先验。
- errorMsg String
如果输入的字符数超过maxCount,则输入错误信息。
- errorRenderer (Map<String, dynamic>) → Map<String, dynamic>
一个函数,它接收错误映射,并返回另一个映射,用人类可读文本替换错误。
警告:此机制的API仍在不断变化,并且会有重大变化。小心依靠它。
- floatingLabel bool
标签是否“浮动”。
如果为false,则在文本输入框中时标签会消失。如果为真,则它会“漂浮”在输入之上。
- hintText String
要在输入上显示的提示。
如果输入上有错误消息,则不会显示此文本。
- inputAriaActivedescendent String
应分配给内部输入元素的aria-activedescendant属性的元素的ID。
- inputAriaAutocomplete String
应用于内部输入元素的自动完成方法。
这可以与“combobox”或“textbox”的inputRole值一起使用。如果此值是“list”或“both”,则inputAriaHasPopup应设置为“true”。
- inputAriaExpanded bool
inputAriaOwns引用的可扩展元素当前是否可见。
- inputAriaHasPopup String
input元素的aria-haspopup属性的值,表示inputAriaOwns引用的元素是可扩展的。
如果inputAriaOwns引用的元素是可扩展的,则它应该是“true”或拥有元素的角色。
- inputAriaLabel String
用于辅助技术的标签。
当需要可见标签时,请使用label代替此标签。
- inputAriaOwns String
应分配给内部输入元素的aria-owns属性的元素的ID。
- label String
此输入的标签。
如果没有在文本框中输入任何内容,则显示默认文本。当用户输入文本时,它会消失。
- leadingGlyph String
要在输入的前沿显示的任何符号 - 例如URL链接图标或类似内容。
- leadingGlyphAriaLabel String
咏叹调标签用于领导字形。
- leadingText String
要在输入的前沿显示的任何文本 - 例如货币符号或类似物。
- maxCount int
字符计数输入框允许的最大字符数。
当值为非null时,始终显示字符计数。
- required bool
是否需要输入。
如果没有输入文本,则必需的输入将在第一次模糊时显示验证错误。
- requiredErrorMsg String
自定义错误消息,以显示何时需要该字段并显示空白。
- rightAlign bool
输入内容是否应始终右对齐。
默认值为false。
- showCharacterCount bool
即使maxCount为null,也显示字符数。
- showHintOnlyOnFocus bool
输入未聚焦时是否显示提示文本。
默认为false。
- trailingGlyph String
在输入的后缘显示的任何符号 - 例如 URL链接图标或类似内容。
- trailingGlyphAriaLabel String
咏叹调标签用于尾随字形。
- trailingText String
要在输入的后缘显示的任何文本 - 例如 货币符号或类似物。
Outputs:
- blur Stream<FocusEvent>
触发失去焦点事件时发布事件。
- change Stream<String>
触发更改事件时发布事件。 (在输入或失去焦点时。)
- focus Stream<FocusEvent>
元素聚焦时的事件。
- inputKeyPress Stream<String>
每当输入文本更改(每个按键)时发布事件。
MaterialMultilineInputComponent
Selector: <material-input[multiline]>
material-input是一个多行文本字段,用户可以在其中键入输入,并且可以选择具有标签。
Inputs:
- characterCounter (String) → int 自定义字符计数器功能。
键入输入文本; 返回文本应被视为多少个字符。
- checkValid (String) → String
已禁用!请改用angular2 forms API
- disabled bool
是否禁用此输入(只读输入)
- displayBottomPanel bool
是否显示错误,提示文本和字符计数器面板。
- error String
显示错误。
比此输入上可能存在的所有其他错误更高的先验。
- errorMsg String
如果输入的字符数超过maxCount,则输入错误信息。
- errorRenderer (Map<String, dynamic>) → Map<String, dynamic>
一个函数,它接收错误映射,并返回另一个映射,用人类可读文本替换错误。
警告:此机制的API仍在不断变化,并且会有重大变化。小心依靠它。
- floatingLabel bool
标签是否“浮动”。
如果为false,则在文本输入框中时标签会消失。如果为真,则它会“漂浮”在输入之上。
- hintText String
要在输入上显示的提示。
如果输入上有错误消息,则不会显示此文本。
- inputAriaLabel String
用于辅助技术的标签。
当需要可见标签时,请使用标签代替此标签。
- label String
此输入的标签。
如果没有在文本框中输入任何内容,则显示默认文本。当用户输入文本时,它会消失。
- maxCount int
字符计数输入框允许的最大字符数。
当值为非null时,始终显示字符计数。
- maxRows int
要显示的最大行数。超过maxRows的任何内容都会导致输入滚动。
- required bool
是否需要输入。
如果没有输入文本,则必需的输入将在第一次失去焦点时显示验证错误。
- requiredErrorMsg String
自定义错误消息,以显示何时需要该字段并显示空白。
- rows int
多行输入应该有多少行。
可以是整数,也可以是字符串。
- showCharacterCount bool
即使maxCount为null,也显示字符数。
- showHintOnlyOnFocus bool
输入未聚焦时是否显示提示文本。
默认为false。
Outputs:
- blur Stream<FocusEvent>
触发失去焦点事件时发布事件。
- change Stream<String>
触发更改事件时发布事件。 (在输入或失去焦点时。)
- focus Stream<FocusEvent>
元素聚焦时的事件。
- inputKeyPress Stream<String>
每当输入文本更改(每个按键)时发布事件。
MaterialAutoSuggestInputComponent
Selector: <material-auto-suggest-input>
material-auto-suggest-input是一个输入字段,提供在用户输入时自动完成输入的建议。此组件的调用者必须提供initial/unfiltered建议的列表,这些建议按组件过滤为用户类型。 过滤器不区分大小写。
通过SelectionOptions实现的ObserveAware接口支持异步建议。
弹出建议列表具有最大高度和自动溢出。 一旦有用例,我们可以为自定义最大高度添加属性。
Inputs:
- ariaLabel String 用于辅助技术的标签。
如果未提供,请改用label。
- characterCounter Function
自定义字符计数器功能。
输入输入文本; 返回文本应被视为多少个字符。
- checkValid Function
已禁用!请改用表单API
- clearIconTooltip String
显示在清除图标上的工具提示。
- closeOnActivate bool
是否在激活时关闭下拉列表。
- closeOnEnter bool
是否关闭甚至输入字符串非匹配选项。
- componentRenderer (dynamic) → Type
已禁用!使用factoryRenderer,因为它可以树摇动。
- constrainToViewport bool
是否限制弹出位置,使其永远不会脱离屏幕。
- disabled bool
是否禁用此输入。
- displayBottomPanel bool
是否显示错误,提示文本和字符计数器面板。
- emptyPlaceholder String
如果选项列表为空且未加载,则显示文本。
- enforceSpaceConstraints bool
弹出窗口是否应根据相对于视口的可用空间自动重新定位自身。
- error String
显示错误。
比此输入上可能存在的所有其他错误更高的先验。
- factoryRenderer (dynamic) → ComponentFactory<dynamic>
FactoryRenderer用于显示项目。
- filterSuggestions bool
允许在用户输入时过滤建议。
如果为false,则始终显示完整的建议列表。
- floatingLabel bool
标签是否“浮动”。
如果为false,则在文本输入框中时标签会消失。如果为真,则它会“漂浮”在输入之上。
- hideCheckbox bool
是否隐藏选择项之前的复选框以进行多选。
- highlightMatchFromStartOfWord bool
匹配是否应仅在单词的开头突出显示。
- highlightOptions bool
是否突出显示选项。
默认值为true。
- hintText String
要在输入上显示的提示。
如果输入上有错误消息,则不会显示此文本。
- initialActivateSelection bool
弹出窗口中的第一个建议是活动的,默认情况下会突出显示。 将此设置为true会更改行为,以便在更改选项或选项时:
1.选择中的第一个选定值在选项中有效
2.如果选择没有选定值,则选项中没有任何活动
- inputText String 输入应该有的文本。
请考虑使用angular_forms NgModel。
- itemRenderer (dynamic) → String
一个简单的函数,用于将项呈现为字符串。
- label String
要在输入上使用的标签。
- labelFactory (dynamic) → ComponentFactory<dynamic>
自定义工厂用于渲染建议标签。
- labelRenderer (dynamic) → Type
请改用labelFactory。
- leadingGlyph String
在输入框之前显示的任何持久字形。
- leadingText String
要在输入的前沿显示的任何文本 - 例如货币符号或类似物。
- limit dynamic
要显示多少建议。
如果限制小于1,则假定为无限制。请参阅Filterable中的过滤方法。默认为10。
- loading bool
打开时没有可用的建议,请在建议下拉列表中显示加载指示符。
- maxCount int
字符计数输入框允许的最大字符数。
当值为非null时,始终显示字符计数。
- optionHighlighter (String, dynamic) → List<HighlightedTextSegment>
返回给定查询和值的HighlightedTextSegment列表的函数。
如果未提供optionHighlighter,则TextHighlighter与itemRenderer一起使用以生成文本段列表。
- selectionOptions SelectionOptions<dynamic>
此容器的可用选项。
- popupMatchInputWidth bool
建议弹出宽度是否至少与输入宽度一样宽。
- popupPositions List<RelativePosition>
尝试绘制建议弹出窗口的位置列表。
有关更多信息,请参见MaterialPopupComponent。
- popupShadowCssClass String
建议弹出内容的自定义CSS类。
- required bool
是否需要输入。
如果没有输入文本,则必需的输入将在第一次失去焦点时显示验证错误。
- requiredErrorMsg String
自定义错误消息,以显示何时需要该字段并显示空白。
- rightAlign bool
输入内容是否应始终右对齐。
默认值为false。
- selection SelectionModel<dynamic>
如果设置,自动建议将使用提供的可观察SelectionModel对象。
默认情况下使用单个选择模型。
- shouldClearOnSelection bool
从菜单中选择项目后是否清除文本。
- showClearIcon bool
显示或隐藏尾随关闭图标。单击该图标将清除输入文本并隐藏弹出窗口。
- showHintOnlyOnFocus bool
输入未聚焦时是否显示提示文本。
默认为false。
- showPopup bool
用于控制建议弹出窗口的可见性。
- slide String
弹出缩放的方向。
有效值为x,y或null。
- sorted bool
已禁用!调用者应该在选项上调用.sort()。
- suggestions List<dynamic>
已禁用!请改用[options]
- trailingGlyph String
要在输入框末尾显示的任何持久字形。
- trailingText String
要在输入的后缘显示的任何文本 - 例如 货币符号或类似物。
Outputs:
- blur Stream<void>
当输入增加失去焦点或自动建议项目被选中时触发。
- clear Stream<void>
单击关闭图标时触发。
- focus Stream<FocusEvent>
当输入获得焦点时触发
- showPopupChange Stream<bool>
showPopup更改时发布事件。
- inputTextChange Stream<String>
输入文本更改时发布事件(在按键上)。
MaterialNumberValueAccessor
Selector: <material-input[type=number],material-input[type=percent]>
ControlValueAccessor,它将输入强制转换为num。
使用materialNumberInputDirectives获取一组与输入一起使用以提供验证的指令。 比如默认确保它是一个数字,checkInteger,checkPositive,checkNonNegative(允许0,)lowerBound和upperBound。
Accessor始终设置从输入设置的原始String值,但仅在可以解析输入时设置Control的值。
keypressUpdate属性在每个按键上都有值更新,而默认值是仅在模糊事件上更新的值。 blurFormat属性导致输入在blur事件上格式化。
查看源码。
MaterialPercentInputDirective
Selector: <material-input[type=percent]>
控制材料输入以接受百分比值的指令。
Inputs:
- percentErrorRenderer Function
允许客户端使用自己的错误消息而不是默认消息的函数。
查看源码。
MaterialInputDemoComponent
MaterialAutoSuggestInputDemoComponent
MaterialPercentInputDemoComponent
MaterialInputMixinDemoComponent
MaterialInputNumberValueAccessorDemoComponent
查看示例,查看源码。
(adsbygoogle = window.adsbygoogle || []).push({}); function googleAdJSAtOnload() { var element = document.createElement("script"); element.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"; element.async = true; document.body.appendChild(element); } if (window.addEventListener) { window.addEventListener("load", googleAdJSAtOnload, false); } else if (window.attachEvent) { window.attachEvent("onload", googleAdJSAtOnload); } else { window.onload = googleAdJSAtOnload; }