2016-12-31 63 views
1

我有纳克重复显示的对象的数组:角:使对象数组的索引从NG-重复访问对象数据

<div class = "row" ng-repeat="article in academicArticles"> 
    <div class = "col-md-9 academicArticle" ng-click = "index = $index"> 
     <a ui-sref ="article"> 
      <h2> {{article.title}} </h2> 
      <p> {{academicArticles.indexOf(article)}} </p> 
      <img src = "{{article.img}}" class = "img-responsive"> 
    </a> 
    </div> 
</div> 

我想显示在另一状态下的选择的“物品”。现在,我有:

<div class ="container"> 
    <div class = "jumbotron"> 
    <img src = "../../../photos/danielpark.jpg"> 
    <h1>{{academicArticles[index].title}}</h1> 
    <p> Written By: {{academicArticles[index].author}} </p> 
    </div> 
</div> 

没有错误,但{{academicArticles[index].author}}{{academicArticles[index].title}是空白。我如何在另一个状态访问所选文章的数据?

+0

最简单的方法是使用url参数传递url中的文章ID,并在其他状态下使用该ID获取该文章。对于链接将像'ui-sref =“article({id:article.id})”' – charlietfl

回答

0

您可以通过将所选“article”的索引作为状态参数传递给另一个状态来完成此操作。 假设其他状态调用状态2,您需要将状态参数添加到状态路由器注册,例如,如果你rigstered喜欢这个新的状态,您可以添加指数跟随

$stateProvider.state("state2", { 
       url: '/state2/:index', 
       templateUrl:'state2.html', 
       controller: 'state2Controller'}); 

和然后在state2Controller您可以使用stateParams服务这样访问索引参数:

(function() { 

      angular 
       .module("app") 
       .controller("state2Controller", state2Controller); 

      state2Controller.$inject = ["$scope", "$stateParams"]; 
      function state2Controller($scope, $stateParams){ 
      $scope.index = $stateParams.index; 

      } 
     })() 
+0

谢谢!有没有办法将整个对象作为状态参数传递?例如url:'/ state2 /:article', –

+0

你不能直接传递hole对象,但是你可以根据需要添加参数,你需要更新状态如下所示$ stateProvider.state(“state2” ,{ url:'/ state2 /:index?param1&param2&param3'然后在ui-serf中可以像这样使用ui-sref =“article({index:article.index,param1:article.params1})” –

0

我想你是ng-repeat范围问题所困,诀窍是不绑定的原始类型的范围,而不是直接使用一些对象像$scope.model$scope.model.authorId