Issue
ng dropdowns are not working.
Note: I followed the answer here and upgraded bootstrap to 4-alpha, yet it's not working.
Below is my package.json file:
"@angular/animations": "^4.3.0",
"@angular/common": "^4.3.0",
"@angular/compiler": "^4.3.0",
"@angular/core": "^4.3.0",
"@angular/forms": "^4.3.0",
"@angular/http": "^4.3.0",
"@angular/platform-browser": "^4.3.0",
"@angular/platform-browser-dynamic": "^4.3.0",
"@angular/router": "^4.3.0",
"@angular/upgrade": "^4.3.0",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.28",
"@types/jquery": "^3.2.8",
"angular-calendar": "^0.19.0",
"angular2-ladda": "^1.2.1",
"angular2-text-mask": "^8.0.2",
"angular2-toaster": "^4.0.1",
"animate.css": "^3.5.2",
"bootstrap": "4.0.0-alpha.6"
html code:
<div ngbDropdown class="d-inline-block">
<button class="btn btn-outline-primary nav-link dropdown-toggle" id="dropdownBasic1" ngbDropdownToggle>More Actions..</button>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownBasic1">
<button class="dropdown-item">Action - 1</button>
<button class="dropdown-item">Another Action</button>
<button class="dropdown-item">Something else is here</button>
</div>
</div>
In my app.module.ts ngbModule is imported too.
import {NgbModule} from "@ng-bootstrap/ng-bootstrap";
@NgModule({
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule,
NgbModule.forRoot()
//more
]
Bootstrap buttons and text inputs working and all the styles are applied, except for dropdown isn't working on click.
Any input is much appreciated.
Solution
NgbModule has to be imported within the separate module as well. Credits: HaveSpacesuit
Answered By - Maddy
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.