AngularJS UI Router: conflit d'itinéraire en raison du paramètre optionnel

J'ai quelques parcours dans mon application AngularJS, j'utilise UI-Router pour le routage entre les états / pages de mon site. Un problème que j'ai, c'est que j'ai des routes conflictuelles en raison d'un paramètre optionnel que j'ai / besoin de la page d'accueil du site.

J'ai un itinéraire pour la page d'accueil ( example.com ) défini plus ou moins comme ça:

 $stateProvider .state('home', { url: '/:filter', params: { filter: { squash: true, value: null } } }); 

Je peux activer cet état en allant à la page d'accueil ( example.com ), ainsi qu'en ajoutant le paramètre optionnel example.com/apples que j'utilise pour filtrer le contenu sur la page d'accueil.

Mon problème est maintenant que j'ai d'autres routes définies comme /login , /about , /help et en allant dans example.com/login ou example.com/help , n'activez que l'état de la home raison du paramètre /:filter optionholderholder J'ai défini quelle capture un itinéraire suivant / .

• Ui-router angulaire ne peut pas résoudre les résultats de ressources $
• Bootstrap collapse et ui-router
• Comment faire pour qu'un bloc de contrôleur soit exécuté chaque fois qu'un état est accessible?
• Ui-router retourne: "Impossible GET / page"
• Comment passer $ state variable dans 2 autres états de frères et sœurs?

Une solution de contournement que j'ai essayée est d'ajouter une barre oblique à mes autres définitions de route et les liens url: /login/ et d'activer: example.com/login/ qui fonctionne mais je ne pourrai pas utiliser la directive ui-sref du routeur UI pour Reportez-vous à mes états par leur nom au lieu de l'URL dans mon application et la barre oblique par défaut semble simplement laide.

Ce que j'essaie d'atteindre est de pouvoir avoir le paramètre facultatif pour la page d'accueil /:filter et pouvoir continuer mes autres itinéraires /login , /register , etc. sans avoir à le contourner en ajoutant des barres obliques.

Est-ce que quelqu'un a été dans cette situation ou une situation similaire avant? Tout un aperçu ou une suggestion est très apprécié. Merci d'avance.

• Modification du menu de navigation à l'aide de UI-Routeur dans AngularJs
• Application angulaire, authentification et ordre des résolveurs dans (ui-) routeur
• Accédez à $ stateParams de nouvel état en service appelé de la fonction de résolution avec UI Router
• Webpack Uglify entraîne le routage pour arrêter le travail
• Les appels consécutifs à console.log produisent des résultats incohérents

 // this url will be registered as first .state('login', { url: "/login", templateUrl: 'tpl.html', }) // this as second .state('about', { url: "/about", templateUrl: 'tpl.html', }) ... // this will be registered as the last .state('home', { url: "/:filter", templateUrl: 'tpl.html', params: { filter: { squash: true, value: null } } }) 

 $stateProvider .state('home', { url: '/?filter' }); 

 $state.go('home', {filter: 'apples'})