Angularjs 通过ui路由器将对象传递给控制器

我正在使用angular/rails创建一个用户配置文件页面。我用ui路由器建立了一个状态提供者，就像这样

$stateProvider
  .state('friendprofile', {
    url: '/{name}',
    views: {
      "friendProfile": {
        templateUrl: '../assets/angular-app/templates/_friendProfile.html',
        controller: 'friendProfileCtrl',
      }
    },
  })

这是模板中的单击操作

%a.profile{"ui-sref" => "friendprofile(user)"}
  name: {{ user.name }}

注意，我在这里传递

user

因此，当点击链接

.profile

时，我转到url。这样很好

在my

friendProfileCtrl

中，我有一个调用服务的函数

friendProfileService.loadProfile().then(function(response) {
  $scope.user_profile = response.data;
  console.log ($scope.user_profile)
})

这就是所谓的服务

app.factory('friendProfileService', ['$http', function($http) {
  return {
    loadProfile: function() {
      return $http.get('/users/4.json');
    }
  };
}])

---

目前我有返回url

users/4/.json

硬编码。我可以在那里找到用户id吗？或者我必须在StateProvider中解析它吗？

您可以在状态中添加用户的

id

参数，以便从

$stateParams

中轻松读取

url: '/{id}/{name}', //assuming user object has `id` property which has unique id.

因此，在制作ajax时，您可以在制作ajax之前直接从用户对象获取用户

id

控制器

friendProfileService.loadProfile($stateParams.id).then(function(response) {
  $scope.user_profile = response.data;
  console.log ($scope.user_profile)
})

工厂

app.factory('friendProfileService', ['$http', '$stateParams', function($http) {
  return {
    loadProfile: function(id) {
      return $http.get('/users/'+ id +'json');
    }
  };
}])

---

您说得对-您应该在控制器加载之前解决它：

$stateProvider
  .state('friendprofile', {
    url: '/{name}',
    views: {
      "friendProfile": {
        templateUrl: '../assets/angular-app/templates/_friendProfile.html',
        controller: 'friendProfileCtrl',
      }
    },
    resolve: {
      user: function($stateParams, friendProfileService) {
        friendProfileService.loadProfile($stateParams.name);
      }
    }
  })

然后在控制器中，您可以注入

user

变量，该变量不是承诺，而是已解析的数据：

app.controller('friendProfileCtrl', [
  '$scope',
  'user',
  ...
  function($scope, user, ...) {
    $scope.user_profile = user;
    console.log($scope.user_profile)
  }
]);

顺便说一句，

uisref

的值应该是这样的：

friendprofile（{name:user}）

---

不要忘记将输入参数添加到

loadProfile

函数中。可能您最好将

{name}

参数重命名为

{id}

谢谢。我不知道您可以传递

$stateParams

。看起来它起作用了。@peterboomma太好了。。很高兴帮助你……谢谢：）