AngularJS regex route pour une url similaire à la charge de contrôleur et la vue

J'ai un parcours similaire, qui devrait se charger d'un point de vue différent et contrôleur en fonction de si oui ou non le paramètre est un nombre. Exemple:

  • /artists/2 devrait ArtistsIndexController avec une vue /www/artists/index.html
  • /artists/name devrait ArtistsProfileController avec une vue /www/artists/profile.html

Idéalement, j'aimerais utiliser quelque chose comme:

$routeProvider.when("/artists/:page", {
  templateUrl: "/www/artists/index.html",
  controller: "ArtistsIndexController"
});

$routeProvider.when("/artists/:name", {
  templateUrl: "/www/artists/profile.html",
  controller: "ArtistsProfileController"
});

Où :page est un nombre et :name ne l'est pas.

Remarque je voir une github problème (trouvé de cette question) mais je me demande si il existe une solution ou solution à privilégier.

OriginalL'auteur Gloopy | 2013-08-08

  1. 5

    Une autre méthode consiste à utiliser le l'interface utilisateur du routeur qui prend en charge les expressions régulières pour les routes (parmi une foule d'autres choses) qui permettrait de:

    $stateProvider.state("artists-index", {
  url: "/artists/{page:[0-9]*}",
  templateUrl: "/www/artists/index.html",
  controller: "ArtistsIndexController"
});

$stateProvider.state("artists-profile", {
  url: "/artists/{name}",
  templateUrl: "/www/artists/profile.html",
  controller: "ArtistsProfileController"
});
    quelle est la différence entre la route & état?
    lorsque j'ai utilisé l'interface utilisateur du routeur j'ai toujours eu un itinéraire pour chaque état, de sorte que j'ai juste pensé que des états comme l'un itinéraire. Le docs mention que chaque etat a besoin d'une route, mais je ne serais pas s'inquiéter à ce sujet au premier abord. Vous pouvez regarder les ceci pour plus de détails sur le concept générique d'une machine d'état.

    OriginalL'auteur Gloopy

  2. 3

    - Je utiliser un vilain hack, qui consistent à modifier la regexp

    var $route = $routeProvider.$get[$routeProvider.$get.length-1]({$on:function(){}});


$routeProvider.when("/artists/:page", {
  templateUrl: "/www/artists/index.html",
  controller: "ArtistsIndexController"
});

$routeProvider.when("/artists/:name", {
  templateUrl: "/www/artists/profile.html",
  controller: "ArtistsProfileController"
});

$route.routes['/artist/:page'].regexp = /^\/(?:artist\/(\d+))$/
$route.routes['/artist/:page/'].regexp = /^\/(?:artist\/(\d+))\/$/

    C'est laid, mais il fonctionne très bien.
    Vous pouvez modifier vos itinéraires les expressions régulières pour les faire correspondre ce que vous voulez.

    Merci beaucoup, c'est très utile pour moi 🙂

    OriginalL'auteur pykiss

  3. 1

    Je suis en utilisant cela comme une solution pour l'instant et s'intéresse à des solutions de rechange!

    1) Créer un modèle générique qui sera en charge d'un contrôleur et d'afficher de manière dynamique:

    <div ng-controller="controller" ng-include src="templateUrl"></div>

    Dans cet exemple, j'ai placé ce point de vue dans /www/shared/dynamic-controller.html

    2) Créer un contrôleur qui vérifie le paramètre de route pour déterminer le contrôleur et la vue de charge:

    angular.module('appName').
  controller('ArtistsDynamicRouteController', ['$scope', '$controller', '$routeParams', function($scope, $controller, $routeParams) {
    if(/^\d+$/.test($routeParams.pageOrId)) {
      //when pageOrId is a page (number) we want to load the ArtistsIndexController
      $scope.controller = $controller('ArtistsIndexController', { $scope: $scope }).constructor;
      $scope.templateUrl = '/www/artists/index.html';
    } else {
      //when pageOrId is an id (non-number) we want to load the ArtistsProfileController
      $scope.controller = $controller('ArtistsProfileController', { $scope: $scope }).constructor;
      $scope.templateUrl = '/www/artists/profile.html';
    }
  }]);

    3) Utiliser une route quel que soit le type de paramètre:

    //handles both /artists/2 and /artists/username
$routeProvider.when("/artists/:pageOrName", {
  templateUrl: "/www/shared/dynamic-controller.html",
  controller: "ArtistsDynamicRouteController"
});
    Voir cette question pour les problèmes avec minification.

    OriginalL'auteur Gloopy