Ole
Ole

Reputation: 46890

Preventing an event from propagating in Angular

I have some navigation setup like this:

    <a (click)="onCustomParameters()">
        <app-custom-start-card></app-custom-start-card>
    </a>

When the user clicks on the app-custom-start-card the onCustomParameters() is fired, triggering navigation.

There is another button in the card that open an external link. When clicked the external link is opened, and the onCustomParameters() is also fired.

For example there is this button inside the card:

<button (click)="issuesTab()">Issues</button> Github Repository.

The issues tab function does this:

  issuesTab(e:any) {
    e.stopPropagation()
    window.open(ISSUES_URL, '_blank');
  }


I thought perhaps e.stopPropagation() would do the trick, but no bieno. Thoughts?

Upvotes: 0

Views: 40

Answers (1)

groetzi
groetzi

Reputation: 198

try passing the $event to issuesTab in your template: <button (click)="issuesTab($event)">, otherwise e would be undefined. apart from that you're on the right track with e.stopPropagation().

Upvotes: 3

Related Questions