bighairdave
bighairdave

Reputation: 692

ng-bootstrap click handler not working in dropdown

I have a a button dropdown menu which I have directly copied from this ng-bootstrap example.

The dropdown works but if add a click handler to the dropdown buttons as follows, it doesn't fire when the button is clicked:

    <div ngbDropdown class="d-inline-block">
      <button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>Toggle dropdown</button>
      <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
        <button ngbDropdownItem click="clicked()">Not Me</button>
        <button ngbDropdownItem click="clicked()">Me neither</button>
        <button ngbDropdownItem click="clicked()">Nor me</button>
      </div>
    </div>

Here is a Stackblitz example forked from the original example.

Am I doing something really stupid? Thanks in advance.

Upvotes: 1

Views: 1946

Answers (1)

jcroll
jcroll

Reputation: 7155

click should be surrounded by brackets:

<div ngbDropdown class="d-inline-block">
  <button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>Toggle dropdown</button>
  <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
    <button ngbDropdownItem (click)="clicked()">Not Me</button>
    <button ngbDropdownItem (click)="clicked()">Me neither</button>
    <button ngbDropdownItem (click)="clicked()">Nor me</button>
  </div>
</div>

Also make sure you have implemented method clicked() in your component

Upvotes: 3

Related Questions