AngularJS orderBy не работает с trackBy

Я не знаю, почему orderBy не работает с trackBy, это сводит меня с ума :(

Вот мой HTML-код:

        <div class="blocks-container" ng-init="loadProjects()" ng-controller="buildMonitorController">
<div class="row">
   <!-- <div> -->
        <div class="col-xs-12 col-sm-6 col-md-3 col-lg-2 block animate"
             ng-if="!errorDialogActive"
             ng-repeat="build in builds.builds.build track by build._id | orderBy:'lastBuildDetails.startDate' : true"
             ng-class="{'running': project.running ,'block-green': build._status ==='SUCCESS','block-red': build._status==='FAILURE'}"
             id="{{build._id}}">
            <div class="title-container"><p>{{build._buildTypeId}}</p></div>
            <div class="update-container col-xs-12">
            <time>{{ build.lastBuildDetails.startDate | date : 'dd.MM.yyyy H:mm:s'}}</time>
            </div>
        </div>
    </div>
    <!--</div>-->

<!-- Start error state dialog -->
<div ng-include src="'views/main/error-dialog.html'"></div>

Everytime give me the same result even if i change the order to reverse

И вот мой код AngularJS:

    $scope.refreshBuilds = function () {
    $scope.errorList.length = 0
    //@TODO remove this part right after the API is working
    //Init
    var suffix = '';
    var randomnumber = Math.floor(Math.random() * 3);


    //simulate mock by random number
    switch (randomnumber) {

        case 1:
            suffix = '-success';
            break;

        case 2:
            suffix = '-less';
            break;

        default:
            break;
    }

    var url = 'mock/builds'+suffix+'.xml';
    console.log('url: ' + url)
    $http({
        method: 'GET',
        url: url,
        headers: {
            Authorization: 'Basic AAA'
        }
    }).success(function (data, status) {
        //Recive builds from xml and reset scope
        var buildsToFilter = new X2JS().xml_str2json(data);
        $scope.errorDialogActive = false;
        //filter builds which have a no build API detail status
        if (buildsToFilter.builds.build !== undefined) {
            angular.forEach(buildsToFilter.builds.build, function (build, index) {
                $http({
                    method: 'GET',
                    url: 'mock/build-'+build._id+'.xml',
                    headers: {
                        Authorization: 'Basic AAA'
                    }
                }).success(function (buildDetailData) {
                    $scope.errorDialogActive = false;
                    //push detail data into build array
                    buildsToFilter.builds.build[index].lastBuildDetails = new X2JS().xml_str2json(buildDetailData).build;
                    console.log(buildsToFilter.builds.build[index]);

                }).error(function (data, status) {
                    $scope.errorDialogActive = true;
                    //remove build from index if no build detail was found
                    buildsToFilter.builds.build.splice(index, 1);
                    $scope.setError(status, '', '');
                }).then(function () {
                    //after filtering builds to display, setup builds $scope for FrontEnd
                    $scope.builds = buildsToFilter;
                });
            });
        } else {

        }

    }).error(function (data, status) {

        //active dialog if error happens & set error
        $scope.errorDialogActive = true;
        $scope.setError(status, 'builds', '');
    }).then(function () {

        $timeout(function () {
            $scope.finishedRequest = true; 
        }, 5000);


        //refresh right after proceed and a little delay
        $timeout(function () {
            console.log('Starting refresh');
            $scope.refreshBuilds();
        }, 21000);


    })
};

Если вам нужно больше кода, пожалуйста, дайте мне знать


person Vistor    schedule 09.04.2015    source источник
comment
загрузите образец скрипки или плунжера, чтобы мы могли внести изменения и обновить его, чтобы помочь вам лучше.   -  person roxid    schedule 09.04.2015
comment
Извините, я пытался заставить его работать в plunker, но для работы требуется много внешних зависимостей :(   -  person Vistor    schedule 09.04.2015


Ответы (1)


Попробуйте прочитать документы. Не похоже, что вы используете его правильно.

https://docs.angularjs.org/api/ng/filter/orderBy

Последний аргумент может быть только "обратным".

Переместите 'track by build._id' в конец выражения (после orderBy).

ng-repeat="build in builds.builds.build track by build._id | orderBy:'lastBuildDetails.startDate' 
person tpie    schedule 09.04.2015
comment
Даже если я его поменяю, он все равно беспорядок. Работает, только если я удалю trackBy, но мне нужен trackBy :( - person Vistor; 09.04.2015
comment
Да, если я скажу так: ng-repeat=build in builds.builds.build | orderBy:'lastBuildDetails.startDate' : обратный путь по build._id Анимации перестают работать - person Vistor; 09.04.2015
comment
не видя кода, трудно понять, что происходит с анимацией. Если убрать реверс, анимация сломается? Правильно ли сортируется сломанная анимация? - person tpie; 09.04.2015
comment
Давайте продолжим обсуждение в чате. - person tpie; 09.04.2015