UI-Router leer Param verursacht Navigation zur falschen Route

Question

Das sollte einfach sein, aber ich kann es einfach nicht herausfinden.

Ich habe zwei Routen:

$stateProvider 

    .state('users', { 
     url: '/users', 
     views: {'@': { 
      templateUrl: 'templates/users.tpl.html', 
      controller: 'UsersCtrl as users' 
     }} 
    }) 
    .state('users.edit', { 
     url: '/{userId}', 
     views: {'@': { 
      templateUrl: 'templates/editUser.tpl.html', 
      controller: 'EditUserCtrl as editUser' 
     }} 
    }); 

Dies funktioniert gut, wenn Sie einen ui-Sref oder $ state.go verwenden, um den „Benutzer“ Zustand nach dem Namen zu navigieren, aber wenn Sie geben domain.com/ Benutzer/In die URL-Leiste geht es mit einem leeren Parameter userId in den Bearbeitungszustand, obwohl hinter dem Trailing Stash nichts steht.

Normalerweise wäre das kein Problem, aber wenn die EditUser-Route ohne userId ausgelöst wird, treten Konsolenfehler auf, die zu beheben wären.

Ist das leicht zu reparieren?

Answer 1

einen Blick auf dieses Thema nehmen:

https://github.com/angular-ui/ui-router/issues/50

und diesen Link in der Post verwiesen:

https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-make-a-trailing-slash-optional-for-all-routes

Answer 2

Ihre Zustände Definition

$ stateProvider

sein sollte

.state('users', { 
    url: '/users', 
    views: {'@': { 
     templateUrl: 'templates/users.tpl.html', 
     controller: 'UsersCtrl as users' 
    }} 
}) 
.state('users.edit', { 
    url: '/edit/{userId}', 
    views: {'@': { 
     templateUrl: 'templates/editUser.tpl.html', 
     controller: 'EditUserCtrl as editUser' 
    }} 
}); 

Ihre untergeordnete Status-URL sollte '/ edit/{userId}' sein. Wenn wir einen Child-Status erstellen, fügt seine URL automatisch die Parent-State-URL hinzu. Wenn Ihre URL also '/ {userId}' lautet, lautet sie 'domain.com/users/{userId}'. Aus diesem Grund navigieren Sie für domain.com/users/ zum Status users.edit mit dem Parameterwert null.

https://github.com/angular-ui/ui-router/wiki/nested-states-%26-nested-views