Question

HTML：

<ul>
  <li ng-repeat="comic in comiclist"> 
    <span>{{ comic.title }} : {{comic.id}}</span>
    <div >
      <img ng-src="{{comic.thumbnail.path}}.{{comic.thumbnail.extension}}"/>
    </div>          
    <div>
      <ul>
        <li ng-repeat="character in charlist + {{comic.id}}">    
          <span>{{character.name}}</span>
        </li>
      </ul> 
    </div>
  </li>
</ul>

JS with angular

var App = angular.module('MarvelApp', []);
  App.controller('MainController', function($scope,$window, $http) {
      $scope.GetSeries = function(){
        $http.get('http://gateway.marvel.com/v1/public/series?')
        .then(function(response){
        $scope.serieslist = response.data.data.results;
        });
      };
    $scope.GetComics = function(){
      $http.get('http://gateway.marvel.com/v1/public/series/' + $scope.selectedseries + '/comics?')
      .then(function(response){
          $scope.comiclist = response.data.data.results;
      });
      //comic in comiclist contains comic.id
      //which needs to go to GetCharacter()
    }
    $scope.GetCharacter = function(comicid){
      $http.get('http://gateway.marvel.com/v1/public/comics/' + comicid + '/characters')
      .then(function(response){
          $scope.['charlist' + comicid]  = response.data.data.results;
       //this list needs to be displayed in the second ng-repeat
      });
    };
  });

我想让字符列表显示在右边的div中。我之前如何设置，（没有$scope.['charlist' + comicid]）它也覆盖了其他ng-repeats。

此外，每当GetComics()被调用时，它都会自动执行。

Answer 1

我不认为$scope.[]是有效的语法（除非我错过了一个漂亮的技巧）。

你应该改为命名一个＆＃34;关联数组＆＃34;在$scope之下：

$scope.charlist[comicid] = ... ;

您的ng-repeat看起来像是：

<li ng-repeat="character in charlist[comic.id]">

编辑如评论中所述，必须先定义$scope.charlist才能使用上述行。这可以通过以下几种方式实现：

在设置之前进行检查：if(!$scope.charlist) $scope.charlist = [];
使用$scope.charlist = [];

当然，你可以通过多种方式实现这一目标，但是我认为这些方法最有意义，第一种方法可以捕获无效状态，即如果由于某种原因$scope.charlist设置为null它会创建一个新的＆＃34;关联数组＆＃34;。

如何在角度的ng-repeat中正确使用变量变量名？

1 个答案: