Ereignisse in ES6-Ecksteuerungen behandeln

Question

Ich experimentiere mit ES6-Klassen für meine Controller.

Früher, wenn ich zu einem rootScope Ereignisse mit ui-Router zu hören war, kann ich so etwas tun:

$rootScope.$on('stateChangeStart', function (event, toState, toParams, fromState, fromParams) { 
    console.log(toState) 
} 

und toState leicht zugänglich sein würde.

Mein ES6 Controller sieht derzeit wie folgt aus:

class NavbarController { 
 
    constructor ($rootScope) { 
 
    this.name = 'navbar' 
 
    this.$rootScope = $rootScope 
 

 
    this.$rootScope.$on('stateChangeStart', this.activeNav()) 
 
    } 
 

 
    activeNav() { 
 
    console.log('This is called') 
 
    return (event, toState, toParams) => { 
 
     console.log('This is never called') 
 
    } 
 
    } 
 
} 
 

 
NavbarController.$inject = ['$rootScope'] 
 
export default NavbarController

Von Beiträge, die ich gelesen hatte, dachte ich, ich auf dem richtigen Weg war jedoch die Funktion, die ich Rückkehr bin heißt nicht, und ich kann nicht herausfinden, wie auf die Ereignisparameter zugegriffen wird.

Was ist der richtige Weg, um Ereignisse in ES6-Winkelreglern zu behandeln?

Answer 1

activeNav() { 
    console.log('This is called') 
    return (event, toState, toParams) => { 
    console.log('This is never called') 
    } 
} 

Sie haben hier eine falsche Syntax verwendet. Pfeilfunktionen müssen einen "=>" Pfeil haben, daher ihr Name. Sie haben einige Syntaxfehler in Ihrem Code. Erwägen Sie, eine IDE oder eine andere Art der automatischen Syntaxprüfung zu verwenden.

Der Name des Ereignisses ist $ stateChangeStart nicht stateChangeStart.

Answer 2

Sielakos wies mich auf mein Problem hin und nutzte dummerweise das falsche Ereignis. Das Arbeits-Snippet ist unten, falls es anderen hilft.

class NavbarController { 
 
    constructor ($rootScope) { 
 
    this.$rootScope = $rootScope 
 
    this.$rootScope.$on('$stateChangeStart', this.activeNav()) 
 
    } 
 

 
    activeNav() { 
 
    return (event, toState, toParams) => { 
 
     console.log(toState.name, toParams) 
 
    } 
 
    } 
 
} 
 

 
NavbarController.$inject = ['$rootScope'] 
 
export default NavbarController