angularjs 未定义的资源

Question

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

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

我的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

我的 APICALL 服务：

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 $resource

It is important to realize that invoking a $resource object method immediately returns an empty reference (object or array depending on isArray). Once the data is returned from the server the existing reference is populated with the actual data. This is a useful trick since usually the resource is assigned to a model which is then rendered by the view. Having an empty object results in no rendering, once the data arrives from the server then the object is populated with the data and the view automatically re-renders itself showing the new data. This means that in most cases one never has to write a callback function for the action methods.

所以基本上是为了 $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 未定义的资源

angularjs undefined resource

angularjs

angular-resource