2017-07-18 6 views
1

In Vanilla JS ist es einfach, einen Link zum Navigieren über preventDefault() zu stoppen. Bei Angular scheint es jedoch nicht so einfach zu sein und ich bin mir nicht sicher, was die richtige Lösung ist. Zum Beispiel habe ich ein Top-Menü, in dem einige Elemente Drop-Downs in einigen Bedingungen sind und sollte auf Klick öffnen, und in anderen sollten sich wie normale Links verhalten. Ich tat, was ich dachte, ich würde es normalerweise tun:Die Routennavigation unter bestimmten Umständen verhindern

toggleMenu(event: Event) { 
    event.preventDefault(); 
    // Usual logic goes here 
} 

Aber diese Navigation nicht aufhört, und ich bin nicht sicher, wie es zu stoppen. Ich kann es viel komplexer machen, indem ich Wachen über jede Verbindung mit einem Dienst erstelle, um es zu stoppen, aber das fühlt sich definitiv übertrieben an. Irgendein Rat?

+1

Versuchen Sie einen 'routerLink' zu stoppen? – cgTag

+0

Ja, tut mir leid, wenn das nicht klar war. – RhoVisions

Antwort

3

Es ist eine gute Frage, und es gibt keine klare Absicht im RouterLink-Quellcode, der anzeigt, dass es eine Unterstützung für die Deaktivierung des Click-Handlers gibt.

Wenn Sie der Routerverbindung null zuweisen, wird sie zur aktuellen Route geleitet. Das ist im Prinzip dasselbe wie die Route nicht zu ändern, aber ich weiß nicht, ob dies noch eine Routenänderung auslöst oder nicht.

<a [routeLink]="condition ? '/my/route/address' : null">Link</a> 

condition kann eine Template-Variable sein oder Sie können eine Komponente-Methode aufrufen, wenn Sie etwas komplizierter berechnen müssen. Der Schlüssel ist null, wenn Sie die Verbindung deaktivieren möchten.

+0

Danke; Ich schaue nach, ob es eine Routenänderung auslöst. – RhoVisions

Verwandte Themen