angularjs undefined resource

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

我發現了什麼事錯了，在控制器填充我不得不添加則（）： ，而不是這樣的：

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; 
     }); 
} 

這解決了這個問題。

Answer 2

從angularjs API documentation爲$資源

意識到調用$資源對象方法 立即返回一個空引用（取決於 IsArray的物體或陣列）是很重要的。一旦數據從服務器返回，現有的 引用就會填充實際數據。這是一個有用的技巧 ，因爲通常該資源被分配給由視圖呈現的模型，然後 。有一個空對象導致沒有渲染， 一旦數據從服務器到達，然後對象與數據填充 和視圖自動重新呈現自己顯示 新數據。這意味着在大多數情況下，從不必爲動作方法編寫回調函數 。

所以基本上對 $scope.infos = myservice.getInfo();， result將有emptyobject/array參考。由於該調用是異步的，因此會立即調用下一行（console.log(result.readOnly)），您將獲得undefined。只有當底層get/post通話實際完成，可變result將與值從服務器