CODEWITHSUNDEEP
angularprimengaccordion
greenbanzai
greenbanzai

Reputation: 99

Disable PrimeNg accordion expand behavior without disabling the whole header

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?

Upvotes: 0

Views: 1413

Answers (1)

Jai
Jai

Reputation: 74748

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
}

Upvotes: 1

Related Questions