通过鼠标或键盘输入内容,是最基础的表单域的包装。
需要用户输入表单域内容时。
提供组合型输入框,带搜索的输入框,还可以进行大小选择。
基本使用。
用于配置一些固定组合
带有搜索按钮的输入框。
nzAutosize 属性适用于 textarea 节点,并且只有高度会自动变化。另外 nzAutosize 可以设定为一个对象,指定最小行数和最大行数。
在输入框上添加前缀或后缀图标。
我们为 nz-input 输入框定义了三种尺寸(大、默认、小),高度分别为 32px、28px 和 22px。
注意: 在表单里面,我们只使用大尺寸的输入框。
输入框的组合展现。
用于多行输入,指定 nzType 为一个特殊的 textarea。可以用 nzRows 或是 nzAutosize 来控制框的高度。
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| ngModel | 当前input数值,可以双向绑定 | String | - |
| nzType | 【必须】声明 input 类型,同原生 input 标签的 type 属性。另外提供 nzType="textarea"。 |
String | 'text' |
| nzPlaceHolder | 在文字框中显示提示讯息 | String | 无 |
| nzSize | 控件大小,默认值为 default 。注:标准表单内的输入框大小限制为 large。 | 'large'|'default'|'small' | 'default' |
| nzDisabled | 是否禁用状态,默认为 false | bool | false |
| nzReadonly | 是否只读状态,默认为 false | bool | false |
| nzBlur | 失去焦点回调 | EventEmitter | 无 |
| nzFocus | 获取焦点回调 | EventEmitter | 无 |
| #addonBefore | 设置前置标签 | ng-template | - |
| #addonAfter | 设置后置标签 | ng-template | - |
| #prefix | 带有前缀图标的 input | ng-template | - |
| #suffix | 带有后缀图标的 input | ng-template | - |
当 nzType="textarea" 时,特有的API
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| nzAutosize | 自适应内容高度,可设置为 true|false 或对象:{{'{ minRows: 2, maxRows: 6 }'}} |
Boolean|Object | false |
| nzRows | 控制固定框的行数 | String | 无 |
当 nzType="search" 时,特有的API
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| nzOnSearch | 回车或点击搜索按钮时的回调 | EventEmitter<string> | - |
在nz-input-group中需要使用[nz-input]的directive,而非component进行组合,具体见demo
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| nzSize | nz-input-group 中所有的 nz-input 的大小 |
'large'|'default'|'small' | 'default' |
| nzCompact | 是否用紧凑模式 | Boolean | false |