javascript - AngularJS 无法使用 ng-repeat 访问 Controller 数据

Question

我有一个包含注释的部分，应该使用 ng-repeat 显示，但我无法访问数据。

调试后，我仍然无法在不修改 Controller 的情况下访问数据! 我对 Angular 还很陌生，所以很容易犯愚蠢的错误。

HTML/JS

'use strict';

angular.module('commentsApp', [])       
        .controller('DishDetailController', ['$scope', function($scope) {

            var dish={
                          name:'Uthapizza',
                          image: 'images/uthapizza.png',
                          category: 'mains',
                          label:'Hot',
                          price:'4.99',
                          description:'A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
                          comments: [
                               {
                                   rating:5,
                                   comment:"Imagine all the eatables, living in conFusion!",
                                   author:"John Lemon",
                                   date:"2012-10-16T17:57:28.556094Z"
                               },
                               {
                                   rating:4,
                                   comment:"Sends anyone to heaven, I wish I could get my mother-in-law to eat it!",
                                   author:"Paul McVites",
                                   date:"2014-09-05T17:57:28.556094Z"
                               },
                               {
                                   rating:3,
                                   comment:"Eat it, just eat it!",
                                   author:"Michael Jaikishan",
                                   date:"2015-02-13T17:57:28.556094Z"
                               },
                               {
                                   rating:4,
                                   comment:"Ultimate, Reaching for the stars!",
                                   author:"Ringo Starry",
                                   date:"2013-12-02T17:57:28.556094Z"
                               },
                               {
                                   rating:2,
                                   comment:"It's your birthday, we're gonna party!",
                                   author:"25 Cent",
                                   date:"2011-12-02T17:57:28.556094Z"
                               }

                           ]
                    };

            $scope.dish = dish;

        }]);

<div ng-app="commentsApp">
  <div ng-controller="DishDetailController">
    <div class="col-xs-9 col-xs-offset-1">
      <div class="blockquote" ng-repeat="entry in dish.comments">
        <blockquote>
          <p>{{entry.comments.rating}} Stars</p>
          <p>{{entry.comments.comment}}</p>
          <footer>{{entry.comments.author}}, {{entry.comments.date | date}}</footer>
        </blockquote>
      </div>
    </div>
  </div>
</div>

Answer 1

你的错误是entry object 代表 dish.comments 中的一个对象数组，因此要访问数据，您只需删除 comments零件

<div ng-app="commentsApp">
  <div ng-controller="DishDetailController">
    <div class="col-xs-9 col-xs-offset-1">
      <div class="blockquote" ng-repeat="entry in dish.comments">
        <blockquote>
          <p>{{entry.rating}} Stars</p>
          <p>{{entry.comment}}</p>
          <footer>{{entry.author}}, {{entry.date | date}}</footer>
        </blockquote>
      </div>
    </div>
  </div>
</div>