Angularjs 按id获取文章

我对ionic和angular都是新手，无法按id获取文章，我从api获取文章列表，这是可行的，但按id获取文章是不可行的。这是我的代码：

控制器：

angular.module('myApp.controllers', [])

.controller('FrontPageController', function($scope, ArticleService) {
  ArticleService.all().then(function(data){
    $scope.articles = data;
  })
})

.controller('ArticleController', function($scope, ArticleService, $stateParams) {
  var article = ArticleService.get($stateParams.id);
});

.controller('ArticleController', function($scope, ArticleService, $stateParams) {
  ArticleService.get($stateParams.id).then(function(response) {
    $scope.article = response;
  })
});

服务：

.factory('ArticleService', function($http) {

  return {
    all: function() {
       return $http.get("http://myApp.app/api/articles/latest").then(function(response){
             articles = response.data;
             return articles;
          });
       },
    get: function(id) {
      var articles = this.all();

      for (var i in articles) {
        if (articles[i].id == id) {
          return articles[i];
        }
      }

      return {};
    }
  };
});

get: function(id) {
      return this.all().then(function(response) {
      var articles = response;
      for (var i in articles) {
        if (articles[i].id == id) {
          return articles[i];
        }
      }
      return {};
      })
    }

和列表视图：

<ion-item ng-repeat="article in articles" href="#/main/article/{{article.id}}">
        <div class="list card">
        <div class="item item-avatar">
          <h3>{{ article.title }}</h3>
          <div ng-repeat="media in article.medias">
            <img src="http://myApp.app/{{media.path}}">
            <p>{{media.path}}</p>
          </div>
        </div>
        <div class="item item-body">
          <img class="full-image" src="http://myApp.app/{{media.path}}">
          <p>
            This is a "Facebook" styled Card. The header is created from a Thumbnail List item,
            the content is from a card-body consisting of an image and paragraph text. The footer
            consists of tabs, icons aligned left, within the card-footer.
          </p>
          <p>
            <a href="#" class="subdued">1 Like</a>
            <a href="#" class="subdued">{{ article.commentsCount }} Comments</a>
          </p>
        </div>
      </div>
      </ion-item>

对象包含如下所示的值：

category_id:1
commentsCount:3
created_at:"2016-05-10 13:56:45"
id:1
medias:Array[0]
slug:"-11"
summary:"dsvsdv"
text:"<p>sdvsdv</p>"
title:"sdvsdv"
type_id:1
updated_at:"2016-06-02 08:19:46"
user_id:3
__proto__

更新代码

如果将来有人需要的话，这最终对我起了作用

服务：

.factory('ArticleService', function($http) {

  return {
    all: function() {
       return $http.get("http://myApp.app/api/articles/latest").then(function(response){
             articles = response.data;
             return articles;
          });
       },
    get: function(id) {
      var articles = this.all();

      for (var i in articles) {
        if (articles[i].id == id) {
          return articles[i];
        }
      }

      return {};
    }
  };
});

get: function(id) {
      return this.all().then(function(response) {
      var articles = response;
      for (var i in articles) {
        if (articles[i].id == id) {
          return articles[i];
        }
      }
      return {};
      })
    }

控制器：

angular.module('myApp.controllers', [])

.controller('FrontPageController', function($scope, ArticleService) {
  ArticleService.all().then(function(data){
    $scope.articles = data;
  })
})

.controller('ArticleController', function($scope, ArticleService, $stateParams) {
  var article = ArticleService.get($stateParams.id);
});

.controller('ArticleController', function($scope, ArticleService, $stateParams) {
  ArticleService.get($stateParams.id).then(function(response) {
    $scope.article = response;
  })
});

---

在我看来，对象是空的，因为您使用异步方法。调用

this.all（）

方法时，将向端点发送HTTP请求。此操作需要时间，在此期间，

项目

未定义，因此您不会进入for循环

试试这个：

var articles = this.all().then(function(response) {
      var articles = response;
      angular.forEach(articles, function(article){
        if (article.id == id) {
          return article;
        }
      }
      return {};
})

---

根据AngularJS文档，然后在结果可用时异步调用一个成功或错误回调。因此，这一次文章不会是空的。

请显示你的json for article对象你在controller或View中遇到错误我已经用json对象的输出更新了我的问题。我没有收到任何错误。请检查您的$stateParams.id值，并检查控制台上get:function（id）中的articles值。我已再次更新我的问题，并且我从console.log（$stateParams.id）获取id；它输出正确的id现在我在get函数中获取对象，但是在我的控制器中，我没有为var article=ArticleService.get（$stateParams.id）定义对象；console.log（文章）；好的，在if循环中，我做了console.log（articles[I]），得到了正确的对象：object{id:1，title:“sdvsdv”，slug:“-11”，category_id:1}，这是相同的问题：异步方法。试着这样做：ArticleService.get（$stateParams.id）.then（function（response）{var article=response；console.log（article）；}）当我这样做时，我得到了TypeError:Cannot read属性'then'的undefinedI不得不在服务中更改get函数，而不是var articles，现在我得到了对象！非常感谢。