ngx-full-content
v0.0.2
Published
安装
Downloads
4
Readme
安装
npm install ngx-full-content
全屏工作区,控制单个的内容模块全屏显示。
API
full-content
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | ------------ | --------- | ------ |
| [(fullscreen)]
| 是否完整全屏 | boolean
| - |
| [padding]
| 工作区内边距 | number
| 24
|
[full-toggle]
切换是否全屏。
全屏控制
包含三种方式:
- 使用
fullscreen
双向绑定 - 使用
[full-toggle]
指令 - 使用
FullContentService.toggle()
服务
切换到全屏后,body 元素上会新增 full-content__opened
class , 那块内容需要显示隐藏,可以根据这个 class 进行进一步控制
##实例
import { NgxFullContentModule } from 'ngx-full-content'
<ngx-full-content (fullscreenChange)="change($event)" >
<div style="background: #ccc;">
<button full-toggle class="ml-sm">全屏</button>
</div>
</ngx-full-content>