32

AngularJS でルートのパラメータのデフォルト値を設定できますか? 同じルートで処理する方法はあり/products/123ますか?/products/

次のような既存のコードをリファクタリングしようとしています。

myModule.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
     when('/products/', {templateUrl: 'products.html', controller: ProductsCtrl}).            
     when('/products/:productId', {templateUrl: 'products.html', controller: ProductsCtrl})
}]);


function ProductsCtrl($scope, $routeParams) {
    $scope.productId = typeof($routeParams.productId) == "undefined" ? 123 : $routeParams.productId;
}

動作しますが、あまりエレガントではありません。より良い方法はありますか？

4

5 に答える 5

35

この質問が古いことは認識していますが、それでも「空の」URL をデフォルトの productId を含む URL にリダイレクトしてみませんか?

myModule.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
     when('/products/', {redirectTo: '/products/123'}).
     when('/products/:productId', {templateUrl: 'products.html', controller: ProductsCtrl})
}]);
于 2013-10-02T02:18:29.313 に答える
24

AngularJSルート パラメータのデフォルト値を許可しません。

AngularJSただし、( の)ルートにはデフォルトのパラメーターがあってはなりません。

リソースにはデフォルトのパラメータが含まれる場合があります。

AngularJSオプションのパラメーターを持つルートが必要な場合、これらは実際には 2 つの異なるルートです。

なんで？

  • ルートは単純であるべき

  • Routes では、パラメーターの正規表現マッチングが許可されていません

  • ルートは、アプリケーションで動作する API を公開するものではありません (リソースとは異なります)。ルートは、URL をテンプレートとコントローラーに接続する単なる構成です。したがって、より多くのルートを持つ方が良いです:

    • どのルートがどの URL にマップされるかは明らかです。

    • より冗長ですが、読みやすくなっています。より複雑なルートを使用すると、AngularJS がルートを必要としないところで、より急な学習曲線が作成されます。

ルートを持つサーバー側フレームワークとは異なり

  • AngularJS ルートには名前がありません。
  • 定義されたルートから URL を作成しません。
  • ルート定義にロジック (別名関数) がありません。

より単純なルート = より多くの行を定義する = より少ない頭痛の種。

注：質問とこの回答は、新しいルート/リソースの実装より前の古いバージョンのAngularJS（1.0だと思います）に対するものであることに注意してください。

于 2012-10-09T19:34:43.833 に答える
6

同様の要件がありました。私がしたことは、解決する関数を作成することでした。以下のようなもの

myModule.config(['$routeProvider', function($routeProvider) {
$routeProvider.
 when('/products/', resolveProduct()).            
 when('/products/:productId', resolveProduct())
}]);


function ProductsCtrl($scope, $routeParams) {
$scope.productId = $routeParams.productId;
}

function resolveProduct() {
   var routeConfig = {
      templateUrl: 'products.html', 
      controller: ProductsCtrl,
      resolve: {
         productId: ['$route', function($route){
            var params = $route.current.params;
            params.productId =  params.productId || 123;
         }]
      }
   }

   return routeConfig;
}
于 2014-12-03T18:30:07.460 に答える
3

URL : "/view/:id/:status?" 、オプションのパラメータを指定できます。

誰かがそれを必要とするかもしれないと思っただけです。

于 2016-01-06T11:26:01.377 に答える