文字和图标

Switch开关

开关选择器。

何时使用#

需要表示开关状态/两种状态之间的切换时；
和 checkbox的区别是，切换 switch 会直接触发状态改变，而 checkbox 一般用于状态标记，需要和提交操作配合。

import { NzSwitchModule } from 'ng-zorro-antd/switch';

代码演示

最简单的用法。

      加载中

文字和图标

带有文字和图标。

      加载中

标识开关操作仍在执行中。

      加载中

Switch 失效状态。

      加载中

nzSize="small" 表示小号开关。

      加载中

Switch 的状态完全由用户接管，不再自动根据点击事件改变数据。

      加载中

API#

nz-switchcomponentstandalone#

参数	说明	类型	默认值	全局配置
`[nzId]`	组件内部 button 的 id 值	`string`	-
`[ngModel]`	指定当前是否选中，可双向绑定	`boolean`	`false`
`[nzCheckedChildren]`	选中时的内容	`string \| TemplateRef<void>`	-
`[nzUnCheckedChildren]`	非选中时的内容	`string \| TemplateRef<void>`	-
`[nzDisabled]`	disable 状态	`boolean`	`false`
`[nzSize]`	开关大小，可选值：`defaultsmall`	`'small' \| 'default'`	`'default'`	✅
`[nzLoading]`	加载中的开关	`boolean`	`false`
`[nzControl]`	是否完全由用户控制状态	`boolean`	`false`
`(ngModelChange)`	当前是否选中的回调	`EventEmitter<boolean>`	`false`

方法#

名称	描述
focus()	获取焦点
blur()	移除焦点