使用 Angularjs $resource从 API 获取信息



我有权访问JSON api,当我使用以下参数询问api时,API URL http://host/api

http://host/api&q=count_people&on=house&house_id=123433

API 响应为:

{
    people: "6"
}

API 的工作方式与前面的示例类似,现在当我尝试在控制器中使用时,我有以下代码

//app.js
var app = app.module('myapp', ['ngResource']);
app.factory('API', function($resource) {
    var API = $resource('host/api');
    return {
      get: function(o, q, params) {
        s = API.get({on: o, q: q, house_id: params.id}, function(u) {
          return u;
        })
        return s;
      }
    };
});
app.controller('myController', function($scope, API) {
  $scope.ns = {
    count_people: function() {
      return API.get('house', 'count_people', {id: 123433});
    }
  };
});

在我的模板中,我有

<!-- mytemplate.html -->
<p>Total of people in house: {{ns.count_people().people}}</p>

ns.count_people().people从不被称为

做你想做的事情的最简单方法需要分两步。 获取数据,显示数据。

http://jsfiddle.net/TheSharpieOne/He9cc/3/(注意:API 端点不返回任何内容,但您可以看到它被调用。一次。

var app = angular.module('app', ['ngResource']);
app.factory('API', function ($resource) {
    return $resource('/host/api/');
});
app.controller('myController', function ($scope, API) {
    $scope.ns = {
        count_people: function (id) {
            API.get({on:"house",q:"count_people",house_id:id}, function(data){
                $scope.ns.people[id] = data.people
            });
        },
        people: []
    };
});

HTML 具有额外的 init 集,用于从 API 获取计数

<p ng-init='ns.count_people(212321)'>Total of people in house: {{ns.people[212321]}}</p>

最新更新