Angular $ routeParams返回空对象

jfl*_*res 8 javascript angularjs

对于一个我无法看透的问题,我已经被困了一天.

我在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("/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 {} 

]
Run Code Online (Sandbox Code Playgroud)

为什么$ routeParams是一个空对象?如果我在视图中调用$ route.current.params,它会显示相应的参数.但不是在控制器中.更重要的是,我不能在控制器中调用$ route.current.params,因为尚未定义"current".

小智 7

我有同样的问题.如果没有ng-view,路由将不起作用.只是有一个ng-view你会得到你的$ routeParams.

问候


小智 0

您的路线指向您的 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'
    )])
Run Code Online (Sandbox Code Playgroud)

然后,比如说,您的用户索引控制器可能如下所示:

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

  $scope.users = User.query()

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

您不需要注入 $http,因为您已经在使用 ngResource REST 抽象。