diff --git a/packages/form/src/sf-item-wrap.component.html b/packages/form/src/sf-item-wrap.component.html
index 370055325..99c9e18ec 100644
--- a/packages/form/src/sf-item-wrap.component.html
+++ b/packages/form/src/sf-item-wrap.component.html
@@ -34,6 +34,6 @@
     <div *ngIf="!ui.onlyVisual && showError" class="ant-form-item-explain ant-form-item-explain-error">
       <div @helpMotion>{{ error }}</div>
     </div>
-    <div *ngIf="schema.description" class="ant-form-item-extra" [innerHTML]="schema._description"></div>
+    <div *ngIf="schema.description" class="ant-form-item-extra" [innerHTML]="ui._description"></div>
   </div>
 </nz-form-item>
diff --git a/packages/form/src/sf.component.ts b/packages/form/src/sf.component.ts
index e915b104a..8e892dbec 100644
--- a/packages/form/src/sf.component.ts
+++ b/packages/form/src/sf.component.ts
@@ -380,7 +380,7 @@ export class SFComponent implements OnInit, OnChanges, OnDestroy {
           property.description = this.fanyi(ui.descriptionI18n);
         }
         if (property.description) {
-          property._description = this.dom.bypassSecurityTrustHtml(property.description);
+          ui._description = this.dom.bypassSecurityTrustHtml(property.description);
         }
         ui.hidden = typeof ui.hidden === 'boolean' ? ui.hidden : false;
         if (ui.hidden === false && ui.acl && this.aclSrv && !this.aclSrv.can(ui.acl)) {
diff --git a/packages/form/src/widgets/array/array.widget.html b/packages/form/src/widgets/array/array.widget.html
index a6af4a73b..5d9a449cf 100644
--- a/packages/form/src/widgets/array/array.widget.html
+++ b/packages/form/src/widgets/array/array.widget.html
@@ -51,7 +51,7 @@
         </ng-container>
       </div>
       <div *ngIf="!ui.onlyVisual && showError" class="ant-form-explain">{{ error }}</div>
-      <div *ngIf="schema.description" [innerHTML]="schema._description" class="ant-form-extra"></div>
+      <div *ngIf="schema.description" [innerHTML]="ui._description" class="ant-form-extra"></div>
     </div>
   </div>
 </nz-form-item>
diff --git a/src/dev/demo.component.ts b/src/dev/demo.component.ts
index 290370be7..cf8ce6608 100644
--- a/src/dev/demo.component.ts
+++ b/src/dev/demo.component.ts
@@ -1,39 +1,49 @@
-import { Component } from '@angular/core';
-
-import { dateTimePickerUtil } from '@delon/util/date-time';
+import { Component, ViewChild } from '@angular/core';
 
+import { SFCascaderWidgetSchema, SFCheckboxWidgetSchema, SFComponent, SFSchema } from '@delon/form';
+import { NzMessageService } from 'ng-zorro-antd/message';
 @Component({
   selector: 'app-demo',
   template: `
-    <p>value: {{ value | _date }}</p>
-    <nz-date-picker
-      [(ngModel)]="value"
-      nzFormat="yyyy-MM-dd HH:mm:ss"
-      [nzDisabledDate]="disabledDate"
-      [nzDisabledTime]="disabledDateTime"
-      nzShowTime
-    ></nz-date-picker>
-    <br />
-    <nz-date-picker nzMode="month" [nzDisabledDate]="disabledDate"></nz-date-picker>
-    <br />
-    <nz-date-picker nzMode="year" [nzDisabledDate]="disabledDate"></nz-date-picker>
-    <br />
-    <p>values: {{ values }}</p>
-    <nz-range-picker
-      [(ngModel)]="values"
-      [nzDisabledDate]="disabledDate"
-      [nzDisabledTime]="disabledDateTime"
-      nzShowTime
-      nzShowNow
-      nzFormat="yyyy-MM-dd HH:mm:ss"
-    ></nz-range-picker>
+    <sf #sf [schema]="schema" (formSubmit)="submit($event)"></sf>
+    result: {{ sf.valid | json }},
+    {{ sf.value | json }}
   `
 })
 export class DemoComponent {
-  value: Date;
-  values: Date[];
-  disabledDate = dateTimePickerUtil.disabledBeforeDate();
-  disabledDateTime = dateTimePickerUtil.disabledBeforeTime({ offsetSeconds: 60 * 5 });
-  // disabledDate = dateTimePickerUtil.disabledAfterDate();
-  // disabledDateTime = dateTimePickerUtil.disabledAfterTime();
+  // 表单对象
+  @ViewChild('sf', { static: false }) sf: SFComponent | undefined;
+  schema: SFSchema = {
+    properties: {
+      // 单个多选框
+      single: {
+        type: 'boolean',
+        title: '同意本协议',
+        description: '《用户协议》',
+        ui: {
+          widget: 'checkbox'
+        } as SFCascaderWidgetSchema,
+        default: true
+      },
+      // 多选框组
+      mulit: {
+        type: 'string',
+        title: 'Mulit',
+        enum: ['Apple', 'Pear', 'Orange'],
+        ui: {
+          widget: 'checkbox',
+          span: 8, // 指定每一项 8 个单元的布局
+          checkAll: false
+        } as SFCheckboxWidgetSchema
+      }
+    },
+    required: ['mulit'],
+    ui: { debug: true }
+  };
+
+  constructor(private msg: NzMessageService) {}
+
+  submit(value: {}): void {
+    this.msg.success(`${this.sf?.valid},${JSON.stringify(value)}`);
+  }
 }