Angular ポータルとオーバーレイレンダリング | ng-hub-ui-portal

現在の DOM ツリーの外側にコンポーネント、テンプレート、オーバーレイを動的にレンダリングする Angular ポータルライブラリ。位置制御に対応します。

最終更新 2026/08/08

概要

チームがこのライブラリを探す理由

この Angular ポータルライブラリは、データフローと Angular との統合を予測可能に保ちながら、コンテンツをオーバーレイやカスタムコンテナーにレンダリングできるよう支援します。

インストール

npm install ng-hub-ui-portal

ジャンプ

最適な用途

  • ドロワー
  • フローティングパネル
  • オーバーレイ UI
  • 動的コンテナー

について portal

ng-hub-ui-portal は、Angular インターフェースがレンダリングを現在の DOM ツリーから切り離す必要があるときに役立ちます。ドロワー、フローティングパネル、動的コンテナー、オーバーレイベースの UI などです。プロジェクションされたコンテンツと位置指定レンダリングのためのよりクリーンな基盤をチームに提供します。

機能ガイド

コンテンツのレンダリング

データ注入と投影機能を備え、さまざまなコンテンツタイプ（Component、TemplateRef、String）のレンダリングをサポートします。

開く戦略

ポータルの開き方を制御します：プログレッシブ（スタック）モードまたは排他的（トグル）モード。

配置

ビューポートまたは特定の要素に対するポータルの柔軟な配置戦略です。

オーバーレイ管理

ポータルオーバーレイのための包括的なバックドロップ、スクロールブロック、フォーカス管理です。

インタラクション

結果を伴うポータルのクローズ／ディスミス、キーボードサポート、カスタムトリガーセレクターに対応します。

ライフサイクル

ポータルの状態管理のためのライフサイクルフックとイベントサブスクリプションです。

主な機能

最近の変更

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

関連ライブラリ

ng-hub-ui-modal ng-hub-ui-nav ng-hub-ui-utils