web-dev-qa-db-ja.com

動的パラメーターを使用したUIルーター解決

これはおそらく簡単ですが、ドキュメントには何も見つからず、グーグルは役に立ちませんでした。 $stateProviderで状態を定義しようとしていますが、必要なデータを取得するためにサーバーでヒットする必要があるURLは、状態URLパラメーターに依存します。要するに、次のようなものです。

 .state('recipes.category', {
    url: '/:cat',
    templateUrl: '/partials/recipes.category.html',
    controller: 'RecipesCategoryCtrl',
    resolve: {
      category: function($http) {
        return $http.get('/recipes/' + cat)
          .then(function(data) { return data.data; });
      }
    }
  })

上記は機能しません。 $routeParamsを注入して、必要なcatパラメーターを取得しようとしましたが、うまくいきませんでした。これを行う正しい方法は何ですか？

angularjsangular-uiangular-ui-router
54
kliron

$routeParams。 ui-routerを使用する場合は、$stateParams代わりに。このコードは私のために機能します：

.state('recipes.category', {
    url: '/:cat',
    templateUrl: '/partials/recipes.category.html',
    controller: 'RecipesCategoryCtrl',
    resolve: {
         category: ['$http','$stateParams', function($http, $stateParams) {
             return $http.get('/recipes/' + $stateParams.cat)
                    .then(function(data) { return data.data; });
         }]
     }
})
105
Reto

Ui-router 1.0を使用している人向け$stateParams非推奨 、 $transition$ 代わりにオブジェクト：

.state('recipes.category', {
    url: '/:cat',
    templateUrl: '/partials/recipes.category.html',
    controller: 'RecipesCategoryCtrl',
    resolve: {
         category: ['$http','$transition$', function($http, $transition$) {
             return $http.get('/recipes/' + $transition$.params().cat)
                    .then(function(data) { return data.data; });
         }]
     }
})
9
Konstantin Azizov