如何下降升序?

时间:2015-12-19 23:08:40

标签: javascript angularjs

我是关于AngularJS的新手。我的问题是我想根据用户输入对数组进行排序。例如,如果用户输入-rating,它应按更多等级的顺序排序,如果用户输入-date则应该是排序最新的订单。我知道我应该使用OrderBy过滤器,但我无法构建机制。对你来说很有帮助。

这里是js代码

<script>
var app = angular.module('confusionApp',[]);
app.controller('dishDetailController', function() {
    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"
            }
            ]
    };
    this.dish = dish;

这里是html代码

 <div class="col-xs-9 col-xs-offset-1">
        <div class="row">
            <div class="col-xs-6">
                <div>
                    <h4>Customer Comments</h4>
                </div>

            </div>
            <div class="col-xs-6">
                <div>
                    <h5>Sort by: <input type="text"></h5>
                </div>
            </div>

        </div>
        <ul class="media-list">
            <li class="media" ng-repeat="comm in dishCtrl.dish.comments ">
                <blockquote>
                    <p>{{comm.rating}}</p>
                    <p>{{comm.comment}}</p>
                    <footer>{{comm.author}} ,<cite>{{comm.date}}</cite></footer>
                </blockquote>

            </li>

        </ul>
    </div>

0 个答案:

没有答案