Question

我的Json文件是here. 我的HomeController是：

app.controller('HomeController', ['$scope', 'events', function($scope, events) {
   events.then(function(data) {
    $scope.events = data;
  });
   $scope.test="success";
}]);

我的html文件是：

<a href="#/">Home</a>
<h1>  {{test}}  </h1>
<section class="container" ng-repeat="event in events">

<div class="col-sm-4" >
      <div class="card">
        <img class="img-responsive" src="https://s3.amazonaws.com/codecademy-content/projects/red-eye-photography/p1.jpg" />
        <div class="block">
          <h4 class="card-title">{{event.events[0].name.text}}</h4>
          <p class="card-text">{{event}}</p>
          <a href="#" class="btn btn-primary">Go somewhere</a>
        </div>
      </div>
  </div>

</section>
<h1>{{test}}</h1>

当我试图循环播放＆＃34;事件＆＃34; JSON文件中的数组。我试着写＆＃34; $ scope.events = data.events;＆＃34;在家庭控制器，＆＃34; ng-repeat =＆＃34; events.events＆＃34;＆＃34;或＆＃34; ng-repeat =＆＃34;事件[0]＆＃34;＆＃34;在html文件中。这打破循环并且没有显示任何内容，但是如果我在事件中使用＆＃34; ng-repeat =＆＃34;事件＆＃34;＆＃34;然后在代码中变量{{event.events [0] .name.text}}，一切正常。我不明白为什么会有问题。从我以前的经历来看，它应该可以正常工作。

Answer 1

如果您在控制器中声明

$scope.events = data.data.events;

并有这样的模板：

<section class="container" ng-repeat="event in events">

  <div class="col-sm-4">
    <div class="card">
      <img class="img-responsive" src="https://s3.amazonaws.com/codecademy-content/projects/red-eye-photography/p1.jpg" />
      <div class="block">
        <h4 class="card-title">{{event.name.text}}</h4>
        <p class="card-text">{{event}}</p>
        <a href="#" class="btn btn-primary">Go somewhere</a>
      </div>
    </div>
  </div>

</section>

它应该有用。请参阅codepen here

AngularJS迭代Eventbrite事件

1 个答案: