Q:

Ionic: Avoid redirecting for button in ion-list

THE SITUATION:
In my Ionic app i am using ion-list.
Each item can swipe to reveal a button (add/remove to favorites).
Each item is a link to the item page.
The problem is that when i click the button, besides triggering the proper function it also activate the link.
THE CODE:
<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 QUESTION:
There is a way to avoid redicting when clicking on the button?
If not an official way, do you know some tricks how this can be achieved?
Thank you!

A:

Since Ionic 0.9.2 there is the directive ion-stop-event that does exactly what you need I suppose. It solves this issue.
To get what you want you need to alter your code like so:
    <ion-option-button ion-stop-event="click" 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 ion-stop-event="click" 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>

