Angular Portal 与 Overlay 渲染 | ng-hub-ui-portal
Angular portal 库，可在当前 DOM 树之外动态渲染组件、模板和 overlay，并支持定位控制。
最后更新 2026年8月8日
概览
团队为何搜索这个库
这个 Angular portal 库帮助你将内容渲染到 overlay 或自定义容器中，同时保持数据流和 Angular 集成的可预测性。
安装
npm install ng-hub-ui-portal跳转到
适用于
- 抽屉
- 浮动面板
- overlay 界面
- 动态容器
关于 portal
ng-hub-ui-portal 在 Angular 界面需要将渲染从当前 DOM 树中分离时非常有用：抽屉、浮动面板、动态容器或基于 overlay 的 UI。它为投影内容和定位渲染提供了更清晰的基础。
功能指南
内容渲染
支持渲染多种内容类型（Component、TemplateRef、String），并具备数据注入和投影能力。
打开策略
控制 portal 的打开方式：渐进式（堆叠）或独占式（切换）模式。
定位
为 portal 提供灵活的定位策略，可相对于视口或特定元素定位。
遮罩层管理
为 portal 遮罩层提供全面的背景遮罩、滚动阻止和焦点管理。
交互
可携带结果关闭/消除 portal，并支持键盘操作和自定义触发器选择器。
生命周期
用于 portal 状态管理的生命周期钩子和事件订阅。
核心特性
最近更改
Version 22.0.4 - 8/8/26, 12:00 AM
fixed: Documentation links now point at the canonical localized URLs. The README linked to https://hubui.dev/<path> with no locale prefix and no trailing slash, and both forms are 301-redirected, so every reader arriving from npm or GitHub landed on a redirect instead of the canonical page.
Version 22.0.3 - 7/28/26, 12:00 AM
fixed: Removed the invalid aria-portal attribute from the portal window host (not a real ARIA attribute); role=dialog and the aria-labelledby/describedby wiring stay.
Version 22.0.2 - 7/26/26, 12:00 AM
fixed: Declared the real ng-hub-ui-utils peer range (>=22.0.0); the previous >=1.0.0 floor allowed resolving an incompatible utils major.
Version 0.3.3 - 1/7/25, 12:00 AM
added: Initial documentation page creation