THE ISSUE:
I am facing an issue in my Ionic app where I am using the ion-list component.
Each item in the list can be swiped to reveal a button (add/remove to favorites).
Additionally, each item serves as a link to another page.
The problem arises when clicking the button triggers its function but also activates the link.
THE CODE SNIPPET:
<ion-list can-swipe="true" class="list" ng-repeat="project in project_list">
<ion-item class="item-content item-text-wrap" ng-click="go_to_project_page( project )">
<h1 class="custom_h1">{{project.name}}</h1>
<ion-option-button class="button-small button-balanced" ng-if="current_project_list_type != 'favorites'" ng-click="project_favorite_add( project.project_id )">
Mark as favorite
</ion-option-button>
<ion-option-button class="button-small button-assertive" ng-if="current_project_list_type == 'favorites'" ng-click="project_favorite_remove( project.project_id )">
Remove from favorites
</ion-option-button>
</ion-item>
</ion-list>
THE QUERY:
Is there a way to prevent the link from being activated when clicking on the button? If not an official solution, are there any tips or tricks that could help achieve this?
Thank you!