访问从工厂返回的对象

Accessing objects returned from a factory

本文关键字：对象 返回 工厂 访问      更新时间：2023-09-26

所以我有一个从服务器获取对象的工厂:

.factory('Articles', function($http) {
  var articles = [];
  return {
        all: function(){
            $http.get("http://jsonp.afeld.me/?url=http://examplesite.com/page.html?format=json").then(function(response){
                articles = response.data.items;
                console.log(response.data.items);
                return articles;
            });
        },
        get: function(articleId) {
            for (var i = 0; i < articles.length; i++) {
                if (articles[i].id === parseInt(articleId)) {
                    return articles[i];
                }
            }
            return null;
        }
    }
});

返回一个数组，如下所示:

[Object, Object, Object, Object, Object, Object, Object, Object]

每个对象看起来像这样:

0: Object
alias: "title"
attachments: Array[0]
author: Object
category: Object
catid: "67"
created: "2015-04-11 08:06:07"
created_by_alias: ""
events: Object
extra_fields: null
featured: "0"
fulltext: ""
gallery: null
hits: "80"
id: "171"
image: ""
 imageLarge: "/url/69bc9c3e85c501b0a6208cc7a55abbf9_L.jpg"
 imageMedium: "/url/69bc9c3e85c501b0a6208cc7a55abbf9_M.jpg"
 imageSmall: "/url/69bc9c3e85c501b0a6208cc7a55abbf9_S.jpg"
 imageWidth: ""
 imageXLarge: "/url/69bc9c3e85c501b0a6208cc7a55abbf9_XL.jpg"
 imageXSmall: "/url/69bc9c3e85c501b0a6208cc7a55abbf9_XS.jpg"
 image_caption: ""
 image_credits: ""
introtext: "<p><strong>Mpho Mathoho</strong>lots of text is here....</p>"
language: "*"
link: "/url/title.html"
modified: "2015-06-02 07:44:30"
numOfComments: "0"
numOfvotes: "(0 votes)"
tags: Array[1]
title: "the title"
video: null
video_caption: ""
video_credits: ""
votingPercentage: 0
__proto__: Object

我的控制器是这样的:

.controller('GautengCtrl', function($scope, $stateParams, Articles) {
  $scope.articles = Articles.all();
})

我所要做的就是返回文章列表并在页面上显示它们。我的HTML看起来像这样:

    <ion-list>
      <ion-item ng-class='{in:$first}' class="item-remove-animate item-thumbnail-left item-icon-right wrap" ng-repeat="article in articles" type="item-text-wrap" href="#/app/provinces/gauteng/{{article.id}}">
        <img ng-src="http://examplesite.com/{{article.imageLarge}}">
        <h2>{{article.title}}</h2>
        <p>{{article.created}}</p>
        <i class="icon ion-chevron-right icon-accessory"></i>
      </ion-item>
    </ion-list>

这是不工作虽然，我真的不明白为什么。

有没有人对此有什么见解?

我认为你的问题可能与承诺有关。记住，当你使用$http时，你是在创建承诺，你应该在使用返回数据时使用相应的回调。

在服务中，你已经使用了。then方法，但是你实际上没有从服务返回任何东西给控制器。你应该返回生成的承诺，并使用.then/。

.factory('Articles', function ($http) {
    var articles = [];
    return {
        all: function () {
            return $http.get("http://jsonp.afeld.me/?url=http://examplesite.com/page.html?format=json").then(function (response) {
                articles = response.data.items;
                console.log(response.data.items);
                return articles;
            });
        },
        get: function (articleId) {
            for (var i = 0; i < articles.length; i++) {
                if (articles[i].id === parseInt(articleId)) {
                    return articles[i];
                }
            }
            return null;
        }
    }
});

在控制器

.controller('GautengCtrl', function ($scope, $stateParams, Articles) {
    $scope.articles = [];
    Articles.all().then(function(data){
        $scope.articles = data;
    });
})
相关文章：