Question

我是angularJs的新手，我正在尝试开发应用程序的第一步，我遇到了问题。

我正在通过$ resource.get（）调用一个返回对象json的外部资源，在callBack中我得到了正确的值，但是在服务中值是未定义的，问题是当我打印资源时在控制台中，结果具有正确的值。

我的json对象：

{
"readOnly": false,
"questions": [
{
    "questionId": "0",
    "questionTitle": "question0",
    "isMondatory": true,
    "responseList": [
        {
        "questionId": "0",
        "questionTitle": null,
        "responseId": "00",
        "responseTitle": "response00"
        },
        {
        "questionId": "0",
        "questionTitle": null,
        "responseId": "01",
        "responseTitle": "response01"
        },
        {
        "questionId": "0",
        "questionTitle": null,
        "responseId": "02",
        "responseTitle": "response02"
        },
        {
        "questionId": "0",
        "questionTitle": null,
        "responseId": "03",
        "responseTitle": "response03"
        }
        ]
    },
    {
    "questionId": "1",
    "questionTitle": "question1",
    "isMondatory": true,
    "responseList": [
        {
        "questionId": "1",
        "questionTitle": null,
        "responseId": "10",
        "responseTitle": "response10"
        },
        {
        "questionId": "1",
        "questionTitle": null,
        "responseId": "11",
        "responseTitle": "response11"
        },
        {
        "questionId": "1",
        "questionTitle": null,
        "responseId": "12",
        "responseTitle": "response12"
        },
        {
        "questionId": "1",
        "questionTitle": null,
        "responseId": "13",
        "responseTitle": "response13"
        }
        ]
    }

我的控制器是

app.controller('mycontroller', function ($scope,myservice) {
 $scope.infos = null;
 $scope.infos = myservice.getInfo();  
}

我的服务是：

angular.module('xxxx').factory('myservice', function($window,$resource,$routeParams,$http,apicallservice) {

// Public API here
return {

    getInfo : function(){
        var result=null;
        var url = "myUrl";
        result = apicallservice.GetApiCall(url,$routeParams);
        console.log(result.readOnly); // print undefined => KO
        return result;
},
//.... other functions

我的apicallservice：

angular.module('xxxx')
  .factory('apicallservice', function ($http,$resource) {

  var result;

// Public API here
return {

  GetApiCall: function (url,obj) {

      // resource         
      var resource = $resource(url,{param1:obj});

      // cal the api              
      result = resource.get(function(callBack) {
          console.log(callBack.readOnly); => print false => OK
          return callBack;
    }, function(error) {
        console.log(error);         
        return error;
    });


    return result;
  },

  PostApiCall : function(url,obj){
      result = $http.post(url,obj).then(
              function (response) {
                    console.log(response);
                  }, function (error) {
                    console.log(error);
                  });
  }
};

}）;

你能帮助我吗？提前谢谢。

Answer 1

来自angularjs api documentation for $ resource

重要的是要意识到调用$ resource对象方法立即返回一个空引用（对象或数组取决于 IsArray的）。一旦数据从服务器返回现有数据引用填充了实际数据。这是一个有用的技巧因为通常将资源分配给当时的模型由视图呈现。拥有一个空对象导致无法渲染，一旦数据从服务器到达，则填充对象随着数据和视图自动重新呈现自己显示新数据。这意味着在大多数情况下，人们永远不必写一个动作方法的回调函数。

所以基本上是为了 $scope.infos = myservice.getInfo();， result会有empty object/array个引用。由于调用是异步的，因此立即调用下一行（console.log(result.readOnly)），您将获得undefined。只有在基础get/post调用实际完成时，变量result才会填充服务器中的值

Answer 2

我发现出了什么问题，在控制器中我必须添加then（）：而不是这个：

 app.controller('mycontroller', function ($scope,myservice) {
  $scope.infos = null;
  $scope.infos = myservice.getInfo();  
 }

这样做：

app.controller('mycontroller', function ($scope,myservice) {
 $scope.infos = null;
  myservice.getInfo().then(function(data) {  
           $scope.infos = data;
        });  
}

这解决了问题。

angularjs未定义的资源

2 个答案: