Question

我正在尝试通过服务将对象分配给$ scope对象。但是我得到一个错误，说明该对象未定义。我正在进行异步调用以获取对象，下面我使用$ timeout服务来模拟相同的。我已经尝试了$ q.defer（）并返回了一个承诺，怀疑它是一个计时问题，并且还调用$ apply（）来调用绑定但似乎没有任何工作。以下是plunker中代码的链接。请帮我解决这个问题。 http://plnkr.co/edit/wyF4Bx1a39IEWS3m8Loe?p=info

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="profctrl">
  <p>Hello {{usr}}!</p>
</body>

</html>

var ub = angular.module('app', []);
ub.controller('profctrl', ["$scope", "formsub", "$log", "$timeout", function($scope, formsub, $log, $timeout) {
  $log.log("In Profile controller");
  $scope.msg = "";
  $scope.usr = {};

  var fbresponse = {
    name: 'xyz',
    email: 'xyz@gmail.com'
  };

  $scope.usr = formsub.getprof(fbresponse);
  $timeout(function() {
    $log.log('$scope.usr', $scope.usr);
  }, 2000);
}]);

ub.service('formsub', ["$http", "$log", "$q", "$timeout", function($http, $log, $q, $timeout) {
  var user = {};
  var self = this;

  self.msg = "";


  self.getprof = function(user) {

      $timeout(function() {
        $log.log('user assigned');
        return user;
      }, 2000);

    } //getprof

}]);

Answer 1

模块名称是app，而不是html ng-app中的plunkr

Answer 2

首先，您提供了错误的模块名称，它应该是ng-app="app"。现在，如果您使用$q，它将正常运行。这是plunkr

Answer 3

var ub = angular.module('myApp', []);
ub.controller('profctrl', ["$scope", "formsub", "$log", "$timeout", function($scope, formsub, $log, $timeout) {
$log.log("In Profile controller");
$scope.msg = "";
$scope.usr = {};

var fbresponse = {
name: 'xyz',
email: 'xyz@gmail.com'
};
formsub.getprof(fbresponse).then(function(result) {
$scope.usr = result;
alert(JSON.stringfy(result));
});

}]);

ub.service('formsub', ["$http", "$log", "$q", "$timeout", function($http, $log, $q, $timeout) {
 var user = {};
 var self = this;
 self.msg = "";
 self.getprof = function(user) {
  var deferral = $q.defer();
  $timeout(function() {
    $log.log('user assigned');
    deferral.resolve(user);
  }, 2000);
  return deferral.promise;
} //getprof
}]);

Demo

我使用$ q。我认为这会对你有帮助

Answer 4

您应该使用promise从$ http获取数据，因为ajax调用是异步的。您可以使用$ q或返回$ http本身，这是一个defferred对象。

服务：

  self.getprof = function(user) {
  var deff = $q.defer();
  //could be get/post/put...
    $http.post(your_api_url, user).
     then(
          function(data){ deff.resolve(data);   },
          function(ex) { deff.reject(ex); }
       );
         deff.promise;

    }

在控制器中：

formsub.getprof(user).
  then(
          function(data){
                 // success call back 
                $scope.usr = data;
             },
          function(ex) { // error call back. Handle error here}
       );

Angular $ scope对象未被分配

4 个答案: