Я пытаюсь реализовать страницу профиля пользователя в учебнике с угловыми направляющими, в котором я прошел. У меня есть следующий порядок:
/javascripts/users/_users.html
User Profile Page
{{user.email}}
/javascripts/users/users.js
angular.module('flapperNews').factory('users', ['$http', function($http){
var o = {
users: []
};
o.get = function(id) {
return $http.get('/users/' + id + '.json').then(function(res){
return res.data;
});
};
return o;
}])
/javascripts/users/usersCtrl.js
angular.module('flapperNews')
.controller('UsersCtrl', [
'$scope',
'users',
'user',
function($scope, users, user){
$scope.user = user;
}])
app.js
отражает это изменение как таковое:
.state('users', {
url: '/users/{id}',
templateUrl: 'users/_users.html',
controller: 'UsersCtrl',
resolve: {
post: ['$stateParams', 'users', function($stateParams, users) {
return users.get($stateParams.id);
}]
}
})
И пользовательский контроллер выглядит так:
class UsersController < ApplicationController
respond_to :json
def show
respond_with User.find(params[:id])
end
end
И маршруты:
Rails.application.routes.draw do
devise_for :users
devise_for :installs
root to: 'application#angular'
resources :posts, only: [:create, :index, :show] do
resources :comments, only: [:show, :create] do
member do
put '/upvote' => 'comments#upvote'
end
end
member do
put '/upvote' => 'posts#upvote'
end
end
resources :users
end
При входе в систему с user id = 2
и попытке попасть на страницу профиля, похоже, проходит:
Started GET "/users/2.json" for ::1 at 2015-10-27 23:07:23 -0400
Processing by UsersController#show as JSON
Parameters: {"id"=>"2"}
User Load (0.1ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? LIMIT 1 [["id", 2]]
Completed 200 OK in 5ms (Views: 0.6ms | ActiveRecord: 0.1ms)
Но на реальной странице я остался с жестко закодированным:
User Profile Page
{{user.email}}
Я чувствую, что мне не хватает чего-то простого, любых идей, что может быть неправильно?
Ваш оператор возврата выполняется до того, как данные фактически заполнены из вызова $http
. Вам нужно использовать $q
.
В сервисе:
var deferred = $q.defer();
$http.get('job.json')
.success(function(response) {
defer.resolve(response);
}).error(function(error) {
console.log(error);
})
return deferred.promise;
В контроллере:
var p = <serviceCall>
p.then(function(s){
$scope.ans=s;
})
$q
используется для получения синхронного ответа. Подробнее читайте в разделе " Угловые документы": https://docs.angularjs.org/api/ng/service/ $ q