最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

angularjs - How to print list in angular javascript? - Stack Overflow

programmeradmin1浏览0评论

Please look into my code:

const DISH = {
  name: 'Uthappizza',
  image: '/assets/images/uthappizza.png',
  category: 'mains',
  label: 'Hot',
  price: '4.99',
  description: 'A unique bination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
  ments: [
    {
      rating: 5,
      ment: "Imagine all the eatables, living in conFusion!",
      author: "John Lemon",
      date: "2012-10-16T17:57:28.556094Z"
    },
    {
      rating: 4,
      ment: "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,
      ment: "Eat it, just eat it!",
      author: "Michael Jaikishan",
      date: "2015-02-13T17:57:28.556094Z"
    },
    {
      rating: 4,
      ment: "Ultimate, Reaching for the stars!",
      author: "Ringo Starry",
      date: "2013-12-02T17:57:28.556094Z"
    },
    {
      rating: 2,
      ment: "It's your birthday, we're gonna party!",
      author: "25 Cent",
      date: "2011-12-02T17:57:28.556094Z"
    }
  ]
};

how to print ments in this ?

Please look into my code:

const DISH = {
  name: 'Uthappizza',
  image: '/assets/images/uthappizza.png',
  category: 'mains',
  label: 'Hot',
  price: '4.99',
  description: 'A unique bination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
  ments: [
    {
      rating: 5,
      ment: "Imagine all the eatables, living in conFusion!",
      author: "John Lemon",
      date: "2012-10-16T17:57:28.556094Z"
    },
    {
      rating: 4,
      ment: "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,
      ment: "Eat it, just eat it!",
      author: "Michael Jaikishan",
      date: "2015-02-13T17:57:28.556094Z"
    },
    {
      rating: 4,
      ment: "Ultimate, Reaching for the stars!",
      author: "Ringo Starry",
      date: "2013-12-02T17:57:28.556094Z"
    },
    {
      rating: 2,
      ment: "It's your birthday, we're gonna party!",
      author: "25 Cent",
      date: "2011-12-02T17:57:28.556094Z"
    }
  ]
};

how to print ments in this ?

Share Improve this question edited Sep 8, 2017 at 11:10 Kalamarico 5,69622 gold badges56 silver badges73 bronze badges asked Sep 8, 2017 at 10:29 karonkaron 291 bronze badge 2
  • 2 Please format. What's the specific issue that any angular tutorial doesn't cover? – Dave Newton Commented Sep 8, 2017 at 10:31
  • Was the answer helpful? – Ankit Agarwal Commented Aug 8, 2018 at 9:48
Add a ment  | 

1 Answer 1

Reset to default 10

You can run ng-repeat on DISH.ments like this,

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

myApp.controller('MyCtrl', function($scope){
    $scope.DISH = { name: 'Uthappizza', image: '/assets/images/uthappizza.png', category: 'mains', label: 'Hot', price: '4.99', description: 'A unique bination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.', ments: [ { rating: 5, ment: "Imagine all the eatables, living in conFusion!", author: "John Lemon", date: "2012-10-16T17:57:28.556094Z" }, { rating: 4, ment: "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, ment: "Eat it, just eat it!", author: "Michael Jaikishan", date: "2015-02-13T17:57:28.556094Z" }, { rating: 4, ment: "Ultimate, Reaching for the stars!", author: "Ringo Starry", date: "2013-12-02T17:57:28.556094Z" }, { rating: 2, ment: "It's your birthday, we're gonna party!", author: "25 Cent", date: "2011-12-02T17:57:28.556094Z" } ] };
});
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='myApp' ng-controller="MyCtrl">
   <div ng-repeat="ment in DISH.ments">
      <div>
         <ul>
           <li>author: {{ment.author}}</li>          
           <li>ment: {{ment.ment}}</li>
           <li>date: {{ment.date}}</li>
           <li>rating: {{ment.rating}}</li>

         </ul>
      </div>
    </div>
</div>

发布评论

评论列表(0)

  1. 暂无评论