簡體   English   中英

Navbar無法在引導程序中運行:4.0.0-beta.2

[英]Navbar doesnt work in an bootstrap: 4.0.0-beta.2

我已經安裝了最新版本的Bootstrap

"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"bootstrap": "^4.0.0-beta.2",
"core-js": "^2.4.1",
"jquery": "^3.2.1",
"popper.js": "^1.12.9",

我實現了一個navbar

<nav class="navbar navbar-expand-md navbar-light bg-light" *ngIf="!isLogged">
  <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active" routerLinkActive="active current">
        <a class="nav-link" routerLink="/sign-up"><span class="">Sign Up</span></a>
      </li>
      <li class="nav-item active" routerLinkActive="active current">
        <a class="nav-link" routerLink="/login"><span class="">Login</span></a>
      </li>
    </ul>
  </div>
</nav>

談到手機尺寸時,應將其轉換為button 確實可以,但是該button不會對任何點擊做出反應。 為什么? 有人有任何線索嗎? 我沒有向angular.cli添加任何腳本。

更新: 項目結構

  "dependencies": {
    "@angular/animations": "^4.0.0",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
    "bootstrap": "^4.0.0-beta.2",
    "core-js": "^2.4.1",
    "jquery": "^3.2.1",
    "popper.js": "^1.12.9",
    "rxjs": "^5.4.1",
    "zone.js": "^0.8.14"
  },

這是您在.angular-cli.json中應該包含的內容

"scripts": [
    "../node_modules/jquery/dist/jquery.slim.min.js",
    "../node_modules/popper.js/dist/umd/popper.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.min.js"
  ],
"styles": [
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.css"
  ]

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM