Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(module:drawer): support new apis nzSize and nzExtra (#7227)
- Loading branch information
1 parent
72da774
commit d2e5b76
Showing
9 changed files
with
218 additions
and
20 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| --- | ||
| order: 6 | ||
| title: | ||
| zh-CN: 预设宽度 | ||
| en-US: Preset size | ||
| --- | ||
|
|
||
| ## zh-CN | ||
|
|
||
| 抽屉的默认宽度为 `378px`，另外还提供一个大号抽屉 `736px`，可以用 `size` 属性来设置。 | ||
|
|
||
| ## en-US | ||
|
|
||
| The default width (or height) of Drawer is `378px`, and there is a presetted large size `736px`. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,56 @@ | ||
| import { Component } from '@angular/core'; | ||
|
|
||
| @Component({ | ||
| selector: 'nz-demo-drawer-size', | ||
| template: ` | ||
| <nz-space> | ||
| <button *nzSpaceItem nz-button nzType="primary" (click)="showDefault()">Open Default Size (378px)</button> | ||
| <button *nzSpaceItem nz-button nzType="primary" (click)="showLarge()">Open Large Size (736px)</button> | ||
| </nz-space> | ||
| <nz-drawer | ||
| [nzSize]="size" | ||
| [nzVisible]="visible" | ||
| nzPlacement="right" | ||
| [nzTitle]="title" | ||
| [nzExtra]="extra" | ||
| (nzOnClose)="close()" | ||
| > | ||
| <ng-container *nzDrawerContent> | ||
| <p>Some contents...</p> | ||
| <p>Some contents...</p> | ||
| <p>Some contents...</p> | ||
| </ng-container> | ||
| </nz-drawer> | ||
| <ng-template #extra> | ||
| <button nz-button nzType="default" (click)="close()">Cancel</button> | ||
| | ||
| <button nz-button nzType="primary" (click)="close()">OK</button> | ||
| </ng-template> | ||
| ` | ||
| }) | ||
| export class NzDemoDrawerSizeComponent { | ||
| visible = false; | ||
| size: 'large' | 'default' = 'default'; | ||
|
|
||
| get title(): string { | ||
| return `${this.size} Drawer`; | ||
| } | ||
|
|
||
| showDefault(): void { | ||
| this.size = 'default'; | ||
| this.open(); | ||
| } | ||
|
|
||
| showLarge(): void { | ||
| this.size = 'large'; | ||
| this.open(); | ||
| } | ||
|
|
||
| open(): void { | ||
| this.visible = true; | ||
| } | ||
|
|
||
| close(): void { | ||
| this.visible = false; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.