2016-03-30 33 views
-1

我有一个json文件,其中包含文章信息,其中每篇文章都有一个id。这是它是如何格式化:访问AngularJS中的特定json数据

[{"title":"ISIS No. 2 killed in US special ops raid", 
    "id":"14589192090024090", 
    "agency":"foxnews", 
    "text":"Article text goes here.", 
    "topic":"Politics", 
    "imagePath":"resources\/images\/foxnews\/14589192090024090.img.jpg"}, 
{"title":", etc etc }] 

在我的主网页我有一个列表视图,显示标题和作者,当你点击文章中,我希望它显示文本,主题,等我angularJS工厂请求JSON看起来是这样的:

this.articles = Articles.query(); 

什么我挣扎的时候我点击一个特定的:

var trooNewsServices = angular.module('trooNewsServices', ['ngResource']); 

    trooNewsServices.factory('Articles', ['$resource', 
    function($resource){ 
    return $resource('resources/articles.json'); 
    }]); 

我通过访问我的主页控制器的文章的完整列表无聊的文章我希望下一页显示那篇文章的信息。我试图通过使用$ routeParams.id获取特定的ID然后在json中查找id来做到这一点。这里是我选择的文章控制器中的代码:

TrooNews.controller('ArticleController', ['$routeParams','Articles', 
    function($routeParams, Articles) { 

     //look through articles for specific article using routeparams 
     Articles.query().$promise.then(function(articles) { 

      for(i = 0; i < articles.length; i++){ 

       if(articles[i].id===$routeParams.id){ 
        this.selectedArticle=articles[i]; 
       } 

      } 

     }); 

     console.log(selectedArticle); 
}]); 

我收到一个错误'无法实例化控制器ArticleController'。如何在promise函数外部访问我的selectedArticle变量?

+1

您的模块名称是** trooNewsServices **。使用** trooNewsServices.controller('ArticleController',['$ routeParams','Articles','$ scope', function($ routeParams,Articles,$ scope){.....})** –

+0

主要TrooNews模块在一个单独的文件我包括trooNewsServices作为该项目的依赖项,所以不应该是问题 –

+0

你可以提供我详细的代码。会给你Plunker。 –

回答

1
TrooNews.controller('ArticleController', ['$routeParams','Articles', 
    function($routeParams, Articles) { 
     var parent = this; 
     parent.selectedArticle = null; 
     parent.setSelectedArticle = function(article){ 
      parent.selectedArticle = article; 
     } 
     //look through articles for specific article using routeparams 
     Articles.query().$promise.then(function(articles) { 
      for(i = 0; i < articles.length; i++){ 
      if(articles[i].id===$routeParams.id){ 
       parent.setSelectedArticle(articles[i]) 
       break; 
      } 
     } 
    }); 
}]); 
+0

这个选项似乎是一个很好的解决方案,但不幸的是,因为即时通讯在我的项目$ scope中使用新的角度路由器不起作用,这就是为什么我使用.this关键字:(github.com/angular/router/issues/313我不知道是否有办法做到这一点范围 –

+0

更新。检查。 –

0

您正在进行异步调用,所以不要指望结果在调用之后就在那里。使用回调方法:

Articles.query().then(function(articles){ 

    for(i = 0; i < articles.length; i++){ 
     if(article[i].id===id){ 
      selectedArticle=article; 
     } 
    } 

    console.log(selectedArticle); 
}) 

或者您可以在回调调用中强制范围摘要。

+0

我得到了这个.then函数来工作,但现在我的selectedArticle变量不是全局的,我不能在任何地方访问它,但在里面。 。我尝试了所有使全局变量可变的东西,但是以为我错过了一些东西 –

+0

你可以把它变成一个范围变量,比如'$ scope.selectedArticle = article;'如果你不需要,就把'var selectedArticle; – Shomz

+0

尝试了这两件事情,他们没有工作,这似乎很奇怪。而不是Articles.query()。那么我不得不使用Articles.query()。$ promise.then,我想知道这是否与它有关。在函数之外(文章)我不能访问selectedArticle,所以不能在我的html中访问它 –