Les routes angularjs peuvent-elles avoir des valeurs de paramètre facultatives?


166

Puis-je définir une route avec des paramètres facultatifs (même modèle et contrôleur, mais certains paramètres doivent être ignorés s'ils n'existent pas?

Alors au lieu d'écrire les deux règles suivantes, n'en ayez qu'une?

module.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
     when('/users/', {templateUrl: 'template.tpl.html', controller: myCtrl}).            
     when('/users/:userId', {templateUrl: 'template.tpl.html', controller: myCtrl})
}]);

Quelque chose comme ça ([ce paramètre est facultatif])

when('/users[/:userId]', {templateUrl: 'template.tpl.html', controller: myCtrl})
//note: this previous doesn't work

Je n'ai rien trouvé dans leur documentation.


ils seront ignorés (sans []) dans la version 1.1.5.
OZ_

vraiment? Je suis sur 1.1.5, essayé avec le code [: userId] et ne les ignore pas.
Alexandru R

essayez sans []. Voir ce commit: github.com/angular/angular.js/commit/…
OZ_

oups, désolé, il s'agit de $ resource, je ne sais pas si cela fonctionnera dans le routage. pardon.
OZ_

1
Si la réponse de g-orge est bonne, pourriez-vous la marquer pour que les gens n'aient pas à faire défiler le tout pour trouver la meilleure réponse?
AlexStack

Réponses:


243

Il semble qu'Angular ait le support pour cela maintenant.

À partir de la dernière documentation (v1.2.0) pour $routeProvider.when(path, route):

pathpeut contenir des groupes nommés facultatifs avec un point d'interrogation ( :name?)


7
Un moyen d'éviter d'utiliser la barre oblique de fin? Si mon itinéraire est: .when('/claims/documents/:CLAIMS_ID/:DOCUMENT_NAME?'...il ne correspondra pas si l'URL n'a pas de barre oblique à la fin. Donc /claims/documents/1234/correspond, mais /claims/documents/1234ne le fait pas.
James Bell

1
Je voudrais savoir si quelqu'un a une solution pour le problème signalé par @JamesBell
Leiko

5
À partir d'Angular 1.3, le problème de barre oblique de fin mentionné dans les commentaires ci-dessus est résolu. La navigation vers / claims / documents / 1234 / fonctionne correctement, tout comme / claims / documents / 1234. En bref, cela fonctionne avec ou sans la barre oblique de fin.
Judah Gabriel Himango

1
Je vois toujours ce comportement si j'ai un paramètre facultatif dans mon itinéraire. Par exemple: si la route est: '/: classification? / Package / compare' et que j'essaye de naviguer vers l'url "/ package / compare" cela fonctionne. Si j'essaye '/ package / compare /' pour une raison quelconque, j'obtiens le code asci ajouté à la classification, ou '/% 3f / package / compare' qui n'est pas une route réelle.
ruby_newbie

La documentation est déroutante.
Oliver Dixon

59

Comme la mention @ g-eorge, vous pouvez le faire comme ceci:

module.config(['$routeProvider', function($routeProvider) {
$routeProvider.
  when('/users/:userId?', {templateUrl: 'template.tpl.html', controller: myCtrl})
}]);

Vous pouvez également créer autant que vous avez besoin de paramètres optionnels.


8

Veuillez voir la réponse @jlareau ici: /programming/11534710/angularjs-how-to-use-routeparams-in-generating-the-templateurl

Vous pouvez utiliser une fonction pour générer la chaîne de modèle:

var app = angular.module('app',[]);

app.config(
    function($routeProvider) {
        $routeProvider.
            when('/', {templateUrl:'/home'}).
            when('/users/:user_id', 
                {   
                    controller:UserView, 
                    templateUrl: function(params){ return '/users/view/' + params.user_id;   }
                }
            ).
            otherwise({redirectTo:'/'});
    }
);

2

En fait, je pense que OZ_ peut être quelque peu correct.

Si vous avez la route '/users/:userId'et naviguez vers '/users/'(notez le /), $routeParamsvotre contrôleur doit contenir un objet contenant userId: ""dans 1.1.5. Donc non, le paramètre userIdn'est pas complètement ignoré, mais je pense que c'est le meilleur que vous obtiendrez.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.