Question

我正在尝试从json API获取数据，我正在使用onsen-ui来创建phonegap应用程序。我正在使用wordpress插件来实现这一目标。这是我试图这样做的方式。

module.factory('$data', function($http) {
      var data = {};


      $http.get('http://www.foduu.com/api/get_recent_posts').
      success(function(data, status, headers, config) {
        console.log(data.posts);
       // return data;
      }).
      error(function(data, status, headers, config) {
        console.log("error in fetching data");
      });
  });

但这是我在console.log中得到的。

enter image description here

在HTML中我编码类似于

<ons-list ng-controller="MasterController">
        <ons-list-item modifier="chevron" class="item" ng-repeat="item in items" ng-click="showDetail($index)">
          <ons-row>
            <ons-col width="60px"> 
              <div class="item-thum"></div>
            </ons-col>
            <ons-col>
              <header>
                <span class="item-title">{{item.title}}</span>
                <span class="item-label">{{item.label}}</span>
              </header>
              <p class="item-desc">{{item.desc}}</p>
            </ons-col>
          </ons-row>                          
        </ons-list-item>
      </ons-list>

对此的任何建议都会非常有用。

谢谢

Answer 1

我认为你错过了return：

module.factory('$data', function($http) {
      var data = {};


      $http.get('http://www.foduu.com/api/get_recent_posts').
      success(function(data, status, headers, config) {
        console.log(data.posts);
       // return data;
      }).
      error(function(data, status, headers, config) {
        console.log("error in fetching data");
      });

      return data;
});

作为旁注，我建议您不要使用$前缀命名自己的服务和工厂。这是其自己提供的服务的Angular约定。

此外，目前，factory并没有做多少事情。你应该回复$http.get给你的承诺：

module.factory('$data', function($http) {
      var data = {

          getRecentPosts: function() {
              return $http.get('http://www.foduu.com/api/get_recent_posts');
          }
      };

      return data;
});

然后处理引用此工厂的控制器中的promise success和error。

Answer 2

您的工厂名称不应以$。开头。

这是一个适合我的工厂的例子

angular.module('appName')
  .factory('FactoryName', function ($http, $q) {

    return {
      myFunctionName: function (callback) {
        var cb = callback || angular.noop;
        var deferred = $q.defer();
        $http.get('insertYourURLHere')
          .success(function (data) {
            deferred.resolve(data);
            return cb();
          }).
          error(function (err) {
            deferred.reject(err);
            return cb(err);
          }.bind(this));

        return deferred.promise;
      },
        };
  });

然后你可以在你的控制器中调用它：

$scope.variableName = FactoryName.getProjects()
      .then(function(data){
        $scope.variableName = data;
      })
      .catch(function(err){
        $log.error(err);
      });

确保在控制器中注入FactoryName依赖项。

无法通过AngularJS + Onsen从json API wordpress获取数据

2 个答案: