Skip to content

Commit

Permalink
docs: update
Browse files Browse the repository at this point in the history
  • Loading branch information
cipchk committed Oct 21, 2023
1 parent 45fcc45 commit 3a6f622
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 27 deletions.
11 changes: 1 addition & 10 deletions packages/form/docs/customize.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ type: Documents

## Foreword

`@delon/form` try our best to meet the needs of different environments, in addition to the built-in basic component widgets, you can further expand the requirements in two ways:
`@delon/form` try our best to meet the needs of different environments, in addition to the built-in basic widgets (Some require manual registration), you can further expand the requirements in two ways:

## Custom widget in sf

Expand All @@ -18,15 +18,6 @@ Making a set of widgets for project can lead to faster development work.

### How to making widget

**Third-party library**

By default `@delon/form` implements some common third-party library widgets, which are called third-party component widgets. This widget exists in [widgets-third](https://github.com/ng-alain /delon/tree/master/packages/form/widgets-third) directory; you can use directly.

| Name | Description | Document | Source |
| ---- | ----------- | -------- | ------ |
| `markdown` | Markdown Editor | [Document](/form/markdown) | [Source](https://github.com/ng-alain/delon/tree/master/packages/form/widgets-third/markdown) |
| `tinymce` | Tinymce Editor | [Document](/form/tinymce) | [Source](https://github.com/ng-alain/delon/tree/master/packages/form/widgets-third/tinymce) |

**Create widgets**

A widget is a component. You only need to inherit `ControlWidget` to create a widget. For example:
Expand Down
13 changes: 1 addition & 12 deletions packages/form/docs/customize.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ type: Documents

## 写在前面

`@delon/form` 尽可能满足不同需求,除现有内置的十几种基础组件小部件外,可以通过以下两种方式进一步扩展需求:
`@delon/form` 尽可能满足不同需求,除现有内置的十几种基础小部件(部分需要手动注册)外,可以通过以下两种方式进一步扩展需求:

## 自定义小部件

Expand All @@ -18,17 +18,6 @@ type: Documents

### 编写小部件

**常见小部件库**

默认情况下 @delon/form 实现了一些常见需求,但需要额外类库支持的,称它为第三方组件小部件,这一部分小部件存在于[widgets-third](https://github.com/ng-alain/delon/tree/master/packages/form/widgets-third)目录里;你可以直接复制使用。

这些组件包括:

| 名称 | 描述 | 文档 | 源代码 |
| --- | ---- | ---- | ---- |
| `markdown` | Markdown 编辑器 | [文档](/form/markdown) | [源代码](https://github.com/ng-alain/delon/tree/master/packages/form/widgets-third/markdown) |
| `tinymce` | Tinymce 富文本框 | [文档](/form/tinymce) | [源代码](https://github.com/ng-alain/delon/tree/master/packages/form/widgets-third/tinymce) |

**自己创建小部件**

小部件就是一个组件,你只需要继承 `ControlWidget` 就相当于构建一个小部件,其结构如下:
Expand Down
12 changes: 7 additions & 5 deletions packages/form/widgets-third/tinymce/demo/simple.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,12 +15,14 @@ Simplest of usage.

```ts
import { Component } from '@angular/core';

import { SFSchema } from '@delon/form';
import type { TinymceWidgetSchema } from '@delon/form/widgets-third/tinymce';
import { NzMessageService } from 'ng-zorro-antd/message';

@Component({
selector: 'app-demo',
template: `<sf [schema]="schema" (formSubmit)="submit($event)"></sf>`,
template: `<sf [schema]="schema" (formSubmit)="submit($event)" />`
})
export class DemoComponent {
schema: SFSchema = {
Expand All @@ -29,10 +31,10 @@ export class DemoComponent {
type: 'string',
title: '描述',
ui: {
widget: 'tinymce',
},
},
},
widget: 'tinymce'
} as TinymceWidgetSchema
}
}
};

constructor(private msg: NzMessageService) {}
Expand Down

0 comments on commit 3a6f622

Please sign in to comment.