Angular http返回$$状态对象

时间:2015-01-26 08:05:24

标签: javascript angularjs angular-services

我有以下工厂定义:

angular.module("account").factory("users",["$http",
    function(a){
      return {
         getUser: function(){
            return a.get("/user/me").then(function(r){
                return r.data;
            });
        }
    };
  }
]);

我的控制员:

angular.module("test.controllers",["account"])
.controller("TestCtrl",["$scope","users",
    function(a,u){
        a.user = u.getUser();
        console.log(a.user);
}]);

这是console.log:

 d {$$state: Object, then: function, catch: function, finally: function} $$state: Object status: 1 value: Object user: Object__v: 0 _id: "54c1fg29f36e117332000005" temp: "1ce3793175e0b2548fb9918385c2de09"  __proto__: Object __proto__: Object __proto__: Object __proto__: Object

上面的代码返回一个状态对象而不是用户对象。 但是从日志中,状态对象具有值内的用户对象。我如何获得用户对象?或者我这样做完全错了吗?

我知道另一种方法是返回$ http.get并在控制器中调用then()方法。但是我经常使用用户对象,如果我在控制器中调用then()方法,它几乎与在控制​​器而不是工厂中使用$ http.get相同。

3 个答案:

答案 0 :(得分:25)

通常是JavaScript I / O,在这种情况下包括异步。您的getUser来电会返回$ q 承诺。为了打开它,你必须链接到它,然后打开它:

angular.module("test.controllers",["account"])
.controller("TestCtrl",["$scope","users",
    function(a,u){
        u.getUser().then(function(user){
            a.user = user;
            console.log(a.user);
        });
}]);

如果您正在使用路由,则可能还需要查看路由中的resolve选项。另请参阅this related question

答案 1 :(得分:2)

angular.module("account").factory("users",["$http",
    function(a){
      var factObj = {
         user: null,
         getUser: function(){
            return a.get("/user/me").then(function(r){
                factObj.user = r.data;
            });
        }
      factObj.getUser();

      return factObj;
    };
  }
]);

angular.module("test.controllers",["account"])
.controller("TestCtrl",["$scope","users",
    function(a,u){
        a.userService = u;
}]);

在你看来

<div ng-controller="TestCtrl as test">{{test.userService.user}}</div>

基于注释进行编辑,对于控制器或视图,这可能无法使用,但是这种模式运行良好,无需在每个可能重用数据的控制器中使用.then。

通常将模型存储在工厂或处理数据获取的服务中,这样可以更轻松地将数据导入到您需要的每个视图中。这里的缺点是,当引用此工厂时,您将获取用户,而不是从控制器显式触发getUser函数。如果你想绕过它,你可以在getUser函数中第一次请求时存储promise,如果已经设置了,则只返回所有后续调用的promise,这样你可以多次调用getUser而不重复API请求。

答案 2 :(得分:0)

我在这里有一个类似的场景..我希望它有所帮助...

我的工厂..

 angular.module('programList.services',[])
    .factory('PROGRAMS', function($http) {
     return {
       getprogramList: function() {
       return $http.get('/api/programs/list').then(function(result) {
       return result.data[0];
       });
      }
     };
    });

这是我的控制器..

 angular.module('programList.services'])
 .controller('tviProgramsController',
    function($scope,$state,$stateParams,PROGRAMS){
        //this is the call to access the list as answered by Benjamin Above using then on success 
        PROGRAMS.getprogramList().then(function(list){
                  $scope.programlist = list;
              });
  });

;

这是在服务器端的路由器上......

  var express     = require('express'),
     programscontroller = require(path + 'programservercontroller'),
     router         = new express.Router();
     router.get('/api/programs/list', programscontroller.programlist);

这是mysql调用的模块

var con   = require('../../database/dbcon'),
mysql = require('mysql');

module.exports.programlist = function(req, res){
 var data = req.params.data;
 var sql = "CALL `sp_programlist`";
  con.query(sql, function(err, result) {
      if(err){
          throw err;
      } else {
          res.send(JSON.stringify(result));
      }
     });
};