CODEWITHSUNDEEP
htmlangulardrop-down-menuangularjs-directivengx-bootstrap
Hacker rocker1169
Hacker rocker1169

Reputation: 83

Getting error for Error: 'BsDropdownDirective' is neither 'ComponentType' or 'DirectiveType'

I am using Angular 9 and NgX [email protected] in my HTML I am having like below:-

<div class="btn-group" dropdown>
  <button id="button-basic" dropdownToggle type="button" class="btn btn-primary dropdown-toggle"
          aria-controls="dropdown-basic">
    Button dropdown <span class="caret"></span>
  </button>
  <ul id="dropdown-basic" *dropdownMenu class="dropdown-menu"
      role="menu" aria-labelledby="button-basic">
    <li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>
    <li class="divider dropdown-divider"></li>
    <li role="menuitem"><a class="dropdown-item" href="#">Separated link</a>
    </li>
  </ul>
</div>

And In my ts file, I am having like this

import { Component } from '@angular/core';
 
@Component({
  selector: 'demo-dropdown-basic',
  templateUrl: './basic.html',
  providers: [
    {
      provide: BsDropdownConfig,
      useValue: { isAnimated: true, autoClose: true },
    },
  ],
})
export class DemoDropdownBasicComponent {}

When I am running the code I am getting the following error:-

core.js:6241 ERROR Error: 'BsDropdownDirective' is neither 'ComponentType' or 'DirectiveType'.
    at extractDirectiveDef (core.js:1964)
    at Array.map (<anonymous>)
    at def.directiveDefs (core.js:1926)
    at createTView (core.js:12307)
    at getOrCreateTComponentView (core.js:12252)
    at addComponentLogic (core.js:13224)
    at instantiateAllDirectives (core.js:12994)
    at createDirectivesInstances (core.js:12209)
    at ɵɵelementStart (core.js:21302)

Upvotes: 0

Views: 1213

Answers (2)

Anh-Thi DINH
Anh-Thi DINH

Reputation: 2374

I had the issue and it was dropdown directive missing from the upper div

Upvotes: 0

Nithin mm
Nithin mm

Reputation: 131

you need to define BsDropdownConfig

 import { Component } from '@angular/core';
 import { BsDropdownConfig } from 'ngx-bootstrap/dropdown'; // add this line
@Component({
  selector: 'demo-dropdown-basic',
  templateUrl: './basic.html',
  providers: [{ provide: BsDropdownConfig, useValue: { isAnimated: true, autoClose: true } }]
})
export class DemoDropdownBasicComponent {}

Upvotes: 0

Related Questions