如何按最近创建的方式列出提要中的帖子？答案

【问题标题】：How can I list posts in a feed by the most recently created?如何按最近创建的方式列出提要中的帖子？
【发布时间】：2017-06-05 20:15:10
【问题描述】：

我使用 Onymos 作为后端。当我从 onymos 中提取数据时，它给了我一个“排列依据”属性，我可以在其中指定“createdTime”作为值，但是，由于某种原因，这不会延续到我的模板中。我认为我的谷歌搜索不再有角度指令的顺序。所以我不确定我还能如何在我的模板中订购它。我的服务将一个数组传递给一个回调函数，该函数在主 TS 页面的构造函数中触发。我对此给予了赏金，因为有人提供的第一个解决方案对我不起作用..不断导致错误。

HOME.HTML

<ion-card id="card" *ngFor="let event of listOfEvents" >      

    <ion-row id="row1">
        <ion-col>
           <span class="showDetails">Date:</span>
           {{getFormattedTime(event.eventTime, 'MM-dd-yyyy')}}
        </ion-col>
        <ion-col>
            <span class="showDetails">Time:</span>
            {{getFormattedTime(event.eventTime, 'HH:MM')}}
        </ion-col>
        <ion-col>
            <span class="showDetails">Venue:</span>
            {{event.venue}}
        </ion-col>                                                   
    </ion-row>

</ion-card>

MyService.TS

getPosts (selectedCity, successCallback, failureCallback) {

        OnymosUtil.getData(

            '/events/' + selectedCity,      
            function getPostsSuccess (listOfEventsObject){
                successCallback(listOfEventsObject);
            },//close function getPostSuccess
            function getPostsFailure (error) {              
                failureCallback(error);
            },
            {
                orderByField: 'createdTime', //OrderByField not working 
                limitToFirst: 100
        });

    }//end getPosts

HOME.TS

export class Home {

    listOfEvents: Array<any> = []; 
    postEvent: any; 

    constructor (public navCtrl: NavController,
                 public popoverCtrl: PopoverController,
                 public getPostSrvc: getPostsService) {

        this.listOfEvents = [];
        let that = this; 

        this.getPostSrvc.getPosts(
           this.selectedCity,
           function getPostsSuccess (listOfEventsObject) {
                for (var i in listOfEventsObject) {
                    that.listOfEvents.push(listOfEventsObject[i]);
                }
           },
           function getPostsFailure (error) {
             console.log('ERROR : home.ts : Failed retrieving Posts - ' + error);
            });
    }//close constructor 
}//close class

【问题讨论】：

标签： javascript angular ionic2 angularjs-orderby

【解决方案1】：

只需在客户端进行排序：

function successCallback (listOfEventsObject) {

    for (var x in listOfEventsObject) {
        that.listOfEvents.push(listOfEventsObject[x]);
    }
    // sort
    that.listOfEvents = that.listOfEvents.sort(function(a, b) {
        return a.createdTime - b.createdTime;
        // or vice versa
        // or any other way you wish to sort
    });

}

【讨论】：

所以在排序函数中我会将每个项目重新推入数组吗？我需要一个数组来传递给模板。我不确定 a、b 参数有何帮助..
查看 JavaScript 排序文档。
@Spilot 您是否尝试实现此评论？
@Duannx... 是的，但它没有用。什么都没有发生，本身没有错误，但我的列表的顺序与往常一样，而不是我想要的顺序。
您需要提供一些输出、控制台日志等。

【解决方案2】：

此处找到的数组反向方法最适合我： https://www.w3schools.com/jsref/jsref_reverse.asp

this.getPostSrvc.getPosts(
           this.selectedCity,
           function getPostsSuccess (listOfEventsObject) {
                for (var i in listOfEventsObject) {
                    that.listOfEvents.push(listOfEventsObject[i]);
                }
                       **that.listOfEvents.reverse();** 
           },
           function getPostsFailure (error) {
             console.log('ERROR : home.ts : Failed retrieving Posts - ' + error);
            });

【讨论】：

【解决方案3】：

您确实需要找出无法在服务器上进行排序的原因。对于应用程序的生产版本，如果您的事件列表仅由一两个事件更新，则在客户端上进行排序可能会变得非常昂贵并且会减慢您的应用程序的速度。也许您可以为createdTime 使用更好的编码。您是否尝试过将此字段转换为时间戳值？例如，您可以使用 moment.js 库来做到这一点：

event.createdTime = moment().valueOf()
其他用户建议的客户端排序是在没有服务器排序的情况下采用的方式。但是，您可以通过同时插入和保持数组排序来使其更加优化。

你可以使用underscore库（或者自己写）找到推送到哪里的索引，用下面的函数代替普通的push：

  sortedPush( array, value ) {
      array.splice( _.sortedIndex( array, value ), 0, value );
  }

【讨论】：