ボタンをクリックしてドロップダウン メニューを開きます
P粉232409069
P粉232409069 2023-09-04 15:04:13
0
1
460
<p>ブートストラップ 5 cdn を使用していますが、ドロップダウンをクリックせずにドロップダウンを開きたいと考えています。 </p> <p>ナビゲーション バーを使用しており、「ドロップダウン リンク」を表示したいと考えています: </p> <pre class="brush:php;toolbar:false;"><nav class="navbar navbar-expand-sm navbar-light bg-light"> <div class="コンテナ-液体"> <a class="navbar-brand" href="#">ナビゲーションバー</a> <ボタン class="navbar-toggler" type=「ボタン」 data-bs-toggle="折りたたむ" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="ナビゲーションを切り替え" > <span class="navbar-toggler-icon"<</span> </ボタン> <div class="navbar を折りたたむ-collapse" id="navbarNavDropdown"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link active" aria-current="page" href="#">ホーム</a> </li> <li class="ナビゲーション項目ドロップダウン">
P粉232409069
P粉232409069

全員に返信(1)
P粉333186285

ボタンにブートストラップ属性を追加:

リーリー

リンク コード: https://stackblitz.com/edit/angular-bootstrap-5-dynamic-navbar-77sj13?file=app/app.component.html

ただし、うまくいきます。 Angular アプリケーションはこれらの要素を制御する必要があるため、外部ライブラリとフレームワーク ライブラリ (Angular、Vue、React) を混在させると常に問題が発生することに注意してください。

この目的のために、次のような特別な実装があります:

https://ng-bootstrap.github.io/#/home 角度ガイド

もう 1 つのオプションは、ngIf を使用してナビゲーション バーを表示することです (デフォルトではアニメーションなし)

別のリンク:

https://stackblitz.com/edit/angular-bootstrap-5-dynamic-navbar-hygpzq?file=app/app.component.html

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!