Disable PrimeNg accordion expand behavior without disabling the whole header

Viewed 15

I'm using PrimeNg accordion in my app. Besides expand/collapse button I have some other buttons in accordion's header.

I would like to be able to disable accordion's ability to expand but at the same time keep other buttons in accordion's header usable.

Unfortunately when I disable an accordion with disabled property, the whole accordion gets disabled and other buttons that are present in my header are not usable too. Is there a way to disable expanding but at the same time keep other stuff I have in my header usable?

1 Answers

It looks like event is getting propagated up in the tree. You can stop the propagation using event.stopPropagation().

Like as you mentioned you have some buttons which are also used to trigger some other actions. You can pass the $event object from the bound event something like:

In your template:

<button (click)="doSomething($event)">Do something</button>

In the component class file:

doSomething(event: Event) {
    event.stopPropagation();
    // other code execution
}
Related