我有一个带有Flask的简单RESTful服务器,并且我想使用AngularJS使用一个ngResource的简单客户端。这个想法是对服务器进行GET,并获取一个json文件。

这是我的services.js

var IpZapServices = angular.module('IpZapServices', ['ngResource']);
IpZapServices.factory('Plug', ['$resource', function($resource) {
    return $resource('http://localhost:8003/api/plugs/:id',
             {id : "@id"}, {
                 query: {method: 'GET', params: {}, isArray: false}
           });
}]);


还有controllers.js

var IpZapControllers = angular.module('IpZapControllers', []);
IpZapControllers.controller('PlugListCtrl', ['$scope', 'Plug', function($scope, Plug) {
    $scope.plugs = Plug.query();
    console.log($scope.plugs);
}]);


但是,我没有得到json文件,得到这个:

Object { $promise: Object, $resolved: false }


为什么?我怎么了谢谢!

编辑:

这是我从服务器收到的原始响应。

{"plugs": [
    {"alarm": [],
     "id": 0,
     "name": "Plug 0",
     "state": false},
    .
    .
    .
    {"alarm": [],
     "id": 3,
     "name": "Plug 3",
     "state": false}
]}


编辑2:解决方案

问题出在服务器上。只需添加到服务器Flask-CORS即可工作!

from flask.ext.cors import CORS
app = Flask(__name__)
cors = CORS(app, resources={r"/api/*": {"origins": "*"}})


解决方案来自this question

最佳答案

您需要解决使用Plug.query()创建的承诺

尝试这个:

Plug.query().$promise.then(function (response) {
     console.log(response)
     $scope.plugs = response;
});


有关更多信息,请参见angularjs.org上的文档:

https://docs.angularjs.org/api/ngResource/service/$resource

关于javascript - Angular REST客户端ngResource无法获取json,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/34211351/

10-13 00:21