如何升序降序？

Question

我是關於AngularJS的新手。我的問題是我想根據用戶輸入對數組進行排序。例如，如果用戶輸入 - 它應該按照更多評級的順序進行排序，如果用戶輸入-date它應該排序最新的順序。我知道我應該使用OrderBy過濾器，但我無法構建該機制。 thnx很多爲你的幫助。

這裏是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> 

Answer 1

添加NG-模式，文本輸入，並在您排序依據過濾器使用這個模型：

<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" ng-model="sortorder"></h5> 
       </div> 
      </div> 

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

      </li> 

     </ul> 
    </div>