ohayolibs
Version:
Ohayo is a set of essential modules for ohayojp.
54 lines (43 loc) • 1.58 kB
Markdown
---
order: 3
title: DrawerHelper
subtitle: 抽屉辅助类
type: Service
---
基于 `NzDrawerService` 封装,它解决一些已知问题:
- 更友好的处理回调
- 响应式处理
## create
```ts
this.drawerHelper.create('Edit', FormEditComponent, { i }).subscribe(res => this.load());
// 对于组件的成功&关闭的处理说明
// 成功
this.NzDrawerRef.close(data);
this.NzDrawerRef.close(true);
// 关闭
this.NzDrawerRef.close();
this.NzDrawerRef.close(false);
```
包括 `create` & `static` 分别用于打开普通或静态抽屉。
**自定义组件HTML模板**
```html
内容
<div class="drawer-footer">
// 底部工具条由 `drawer-footer` 包裹
<button nz-button [nzType]="'default'" (click)="cancel()">
Cancel
</button>
<button nz-button [nzType]="'primary'" (click)="ok()">
OK
</button>
</div>
```
若无需要底部工具条,需要指定参数 `footer: false`。
## API
| 名称 | 类型 | 默认值 | 功能 |
| --- | --- | --- | --- |
| `size` | 指定抽屉大小,响应式只支持非数字值,若值为数值类型,则根据 `nzPlacement` 自动转化为 `nzHeight` 或 `nzWidth` | `sm,md,lg,xl,number` | `md` |
| `footer` | 是否需要工具条 | `boolean` | `true` |
| `footerHeight` | 工具条高度 | `number` | `55` |
| `exact` | 是否精准(默认:`true`),若返回值非空值(`null`或`undefined`)视为成功,否则视为错误 | `boolean` | `true` |
| `drawerOptions` | 抽屉 [NzDrawerOptions](https://ng.ant.design/components/drawer/zh#nzdraweroptions) 参数 | `NzDrawerOptions` | - |