角型$ routeParamsは空のオブジェクトを返します

Question

私は見ることができない問題について約1日立ち往生しています。

私はusers.js.coffeeファイルに次のコードを持っている：

app = angular.module("app", ["ngResource"]) 
app.config ['$routeProvider', '$locationProvider', ($routeProvider, $locationProvider) -> 
    $locationProvider.html5Mode(true) 
    $routeProvider.when('/users/:id', {templateUrl: '/users/:id.json', controller: UserCtrl}) 
    $routeProvider.when('/users/:id/videos', {templateUrl: '/users/:id/videos.json', controller: UserCtrl}) 
] 

app.factory "User", ["$resource", ($resource) -> 
    $resource("https://stackoverflow.com/users/:id", {id: "@id"}, { 
    show: {method: "GET"}, 
    videos: {method: "GET", isArray:true} 
    }) 
] 

@UserCtrl = ["$scope", "$location", "$route", "http", "$routeParams", "User", ($scope, $location, $route, $http, $routeParams, User) -> 
    console.log($location)//LocationUrl {$$parse: function, $$compose: function, $$rewriteAppUrl: function, $$protocol: "http", $$host: "localhost"…} 

    console.log($route)//Object {routes: Object, reload: function} 
    console.log($routeParams)//Object {} 

] 

なぜrouteParamsが空のオブジェクトである$でしょうか？ビューで$ route.current.paramsを呼び出すと、適切なパラメータが表示されます。しかし、コントローラではありません。さらに、 "current"はまだ定義されていないので、コントローラで$ route.current.paramsを呼び出すことはできません。

Answer 1

あなたのルートはあなたのAPIルートを指しています。その後、たとえば、ユーザーがインデックスコントローラは、おそらく次のようになり

@App = angular.module('app',['ngResource']) 
    .config(['$routeProvider'], ($routeProvider) -> 
    $routeProvider 
     .when('/users', 
     templateUrl: 'users/index.html', 
     controller: 'UsersIndexCtrl') 
     .when('/users/:id', 
     templateUrl: 'users/show.html', 
     controller: 'UsersShowCtrl') 
     .otherwise(
     redirectTo: '/users' 
    )]) 

：

App.controller 'UsersIndexCtrl',['$scope','$location','User', ($scope, $location, User) -> 

    $scope.users = User.query() 

    $scope.onClickHandlerToRoute = (user)-> 
    $location.path "path/to/show/user/#{user.id}" 

あなたはあなたとして$ HTTPを注入する必要はありません。彼らは代わりにレンダリングするテンプレートへのパスでなければなりませんすでにngResource REST抽象化を使用しています。

Answer 2

私は同じ問題を抱えていました。 ng-viewがない場合、ルーティングは機能しません。 ng-viewを持っていれば、$ routeParamsを手に入れることができます。

よろしく

Answer 3

$ routeParamsは$ routeProvider/NG-ビューを経由してルーティングされ、それらの外のコントローラにコントローラの初期化時に利用できないように見えます。 （角1.0.8で少なくとも）

あなたがそれらの外のコントローラにルートパラメータにアクセスする場合は、ルーティング-するNG-ビューコントローラ（外部コントローラを使用している場合は、$location.search().<param_name>

Answer 4

を使用することができますトップバーやページコントローラのように）、 '$ routeChangeSuccess'エミットメッセージを購読する必要があります。

受信側コントローラでない場合、経路変更の成功は非同期です。 これで、より完全な答えが得られます。 $routeParams is empty in main controller

これはtldrです。

$scope.$on('$routeChangeSuccess', function() { 
    // $routeParams should be populated here 
});