在 AngularJS 中异步调用 hprose.httpclient答案

【问题标题】：Call hprose.httpclient asynchronously in AngularJS在 AngularJS 中异步调用 hprose.httpclient
【发布时间】：2014-12-10 17:25:04
【问题描述】：

我有一个处理用户身份验证的 Hprose 服务器。我正在尝试编写一个 logonService，它在用户登录后返回一个 UserInfo 对象。在下面的代码中，hprose.HttpClient.login() 被异步调用，它需要几秒钟，但控制器中的代码在创建 logonService 实例后继续运行。这样 $scope.user 始终为空，并且 logonService.logon() 永远不会被调用。我尝试使用 $http.get，但无法弄清楚如何使用 Hprose 获取 Promise obj，而不是示例代码中的 Http。在 Google 中搜索并没有提供任何有用的信息。有人知道该怎么做吗？谢谢。

var app = angular.module("myApp",[])
  .service("logonService", function() {
     var httpclient = new hprose.HttpClient("http://testurl.com:4800/webapi/", ["login"]);
     httpclient.login("userid", "ppt", function(sid) {
        console.log("sid1="+sid);
     }
     this.logon = function() {
        console.log("here I am");
        return something;
     }
    })
   .controller（"myCtrl", ["logonService", function(logonService) {
       var user = logonService.logon();
       $scope.user = user;
   }
)

【问题讨论】：

标签： javascript angularjs asynchronous promise angular-promise

【解决方案1】：

部分问题是myCtrl 中的代码不等待logonService.logon() 的异步结果。此外，我们不知道httpclient.login() 是否返回承诺或什么。所以我们需要把它包装在 $q 承诺中。

var app = angular.module("myApp",[])

app.service("logonService", function() {
    var loginURL = "http://testurl.com:4800/webapi/";
    var httpclient = new hprose.HttpClient(loginUrl, ["login"]);

    // wrap login fn w/ new $q promise
    this.logon = function(userid, ppt) {
        return $q(function(resolve,reject){ 
            httpclient.login(userid, ppt, function(sid) {
                console.log("sid1="+sid);
                // resolve or reject fn based on results passed to callback
                if (sid) {
                resolve(sid);
                } else {
                reject('sid wasn\'t defined!');
                }
            })
        }
    }

})

app.controller（"myCtrl", ["logonService", 
    function(logonService) {
        logonService.logon(userid, ppt).then(function(user){
            //  assign user to scope only after promise resolved
            //  'user' arg will be whatever passed to 'resolve' above
            $scope.user = user; 
        })
        .catch(function(e){
            console.log('An Error happened: ' + e)
            // logon server was down, etc.
        })
    }
])

Here 是 AngularJS 的 $q 的良好参考。这会让你知道如何在任何情况下创建 Promise。

希望这对您有所帮助。

【讨论】：

你确定你的意思是logonService.logon()？正如所写，这是一个承诺，而不是一种方法。
更好，但括号/大括号需要排序。
服务的最后四行仍然是错误的。缺少一个 ')' 并且所有四个都应该有分号。
无论如何，这是为了说明概念，而不是剪切粘贴修复
感谢所有帮助。我明白了。

【解决方案2】：

var app = angular.module("myApp",[])

app.service("logonService", function() {
    var loginURL = "http://testurl.com:4800/webapi/";
    var httpclient = new hprose.HttpClient(loginUrl, ["login"]);

    this.logon = function(userid, ppt) {
        // the result of httpclient.login is already a promise object.
        return httpclient.login(userid, ppt);
    }
})

app.controller（"myCtrl", ["logonService", 
    function(logonService) {
        logonService.logon(userid, ppt).then(function(user){
            //  assign user to scope only after promise resolved
            //  'user' arg will be whatever passed to 'resolve' above
            $scope.user = user; 
        })
        .catch(function(e){
            console.log('An Error happened: ' + e)
            // logon server was down, etc.
        })
    }
])

httpclient.login 的结果已经是一个promise 对象，所以你不需要使用$q 来包装它。

【讨论】：