При попытке отсортировать умную таблицу запускает новый вызов ajax

У меня есть умная таблица Angular.js, где источником данных является вызов Ajax с использованием $ resource. Я использовал st-pipe, чтобы указать функцию ajax, и я использую st-safe-src.

При инициализации интеллектуальная таблица завершает запрос ajax и загружает таблицу.

Пока все хорошо, но ...

У меня две проблемы ...

1 - Мой столбец сортировки по умолчанию не применяется при начальной загрузке.

2 - Я обнаружил, что каждый раз, когда я пытаюсь отсортировать данные, щелкая заголовок столбца, интеллектуальные таблицы запускают новый вызов Ajax для повторного получения исходных данных.

Я надеялся, что умные таблицы смогут сортировать на стороне клиента и, следовательно, не будут выполнять вызов ajax для сортировки. Я считаю, что для этого и нужен st-safe-src. Я ошибся?

Цените это, кто-то мог мне помочь.

Спасибо

Вот мой Контроллер ...

eposWebAngularStrutsApp.controller('StoreHealthCheckController', ['StoreServerHealth', function (StoreServerHealth) {
    var ctrl = this;
    this.rowCollection = []; // base collection
    this.displayedCollection = [];  // displayed collection

    this.callServer = function callServer(tableState) { 
        ctrl.isLoading = true;
        StoreServerHealth.query(function(result) {          
            ctrl.rowCollection = result;
            ctrl.displayedCollection = [].concat(ctrl.rowCollection);
            ctrl.isLoading = false;
          })
          .error(function () {
              ctrl.errorMsg = "An Error has occured while loading posts!";

         });
    };  
}]);

Вот мой шаблон ...

<div class="table-container" ng-controller="StoreHealthCheckController as mc">
<table st-table="mc.displayedCollection" st-safe-src="mc.rowCollection" st-pipe="mc.callServer" class="table table-striped ng-isolate-scope">
    <thead>
    <tr>
        <th st-sort-default="true" st-sort="locationId">Store</th>
        <th>Server</th>
        <th>Conn Status</th>
        <th>Last Updated</th>
        <th>MDI</th>
        <th>Last Synched (MDI)</th>
        <th>DSM</th>
        <th>Last Synched (DSM)</th>
        <th>Trading Status</th>
        <th>Build</th>
    </tr>
    </thead>
    <tbody ng-show="mc.isLoading">
    <tr>
        <td colspan="10" class="text-center">Loading ... </td>
    </tr>   
    </tbody>    
    <tbody ng-show="!mc.isLoading">
    <tr ng-repeat="row in mc.displayedCollection">
        <td>{{row.locationId}}</td>
        <td>{{row.clientId | clientIdToStoreServerType}}</td>
        <td>
            <img ng-src="img/{{row.status | statusToTrafficLightImage}}.png" alt="{{row.status}}"/>
        </td>
        <td>{{row.lastUpdateTime | date:'dd-MM-yyyy hh:mm:ss'}}</td>
        <td><img ng-src="img/{{row.replicationStatus | statusToTrafficLightImage}}.png" alt="{{row.replicationStatus}}"/></td>
        <td>{{row.lastReplicationSyncTime | date:'dd-MM-yyyy hh:mm:ss'}}</td>
        <td><img ng-src="img/{{row.dsmReplicationStatus | statusToTrafficLightImage}}.png" alt="{{row.dsmReplicationStatus}}"/></td>
        <td>{{row.dsmLastSynchTime | date:'dd-MM-yyyy hh:mm:ss' }}</td>
        <td>{{row.storeTradingStatus | tradingStatusCodeToTradingStatus}}</td>
        <td>{{row.buildVersion}}</td>
        <td>
            <button type="button" ng-click="removeRow(row)" class="btn btn-sm btn-primary">
                <i class="fa fa-bolt"></i>              
            </button>
            <button type="button" ng-click="removeRow(row)" class="btn btn-sm btn-primary">
                <i class="fa fa-desktop"></i>
            </button>
            <button type="button" ng-click="removeRow(row)" class="btn btn-sm btn-primary">
                <i class="fa fa-server"></i>
            </button>
            <button type="button" ng-click="removeRow(row)" class="btn btn-sm btn-primary">
                <i class="fa fa-info-circle"></i>               
            </button>                                   
        </td>           
    </tr>
    </tbody>
</table>
</div>

Благодарность


person Richie    schedule 27.10.2015    source источник
comment
Пока нет комментариев по этому поводу. В качестве подвопроса к этому вопросу, интеллектуальные таблицы предназначены для создания нового запроса ajax при сортировке столбцов. Я спрашиваю, потому что в коде умных таблиц функция конвейера вызывается в конце функции сортировки?   -  person Richie    schedule 28.10.2015


Ответы (1)


Я решил это, вынув st-pipe из определения моей таблицы и изменив свой контроллер следующим образом ...

eposWebAngularStrutsApp.controller('StoreHealthCheckController', ['StoreServerHealth', function (StoreServerHealth) {

    var ctrl = this;
    ctrl.rows = [];
    ctrl.displayedRows = [];

    ctrl.isLoading = true;
    StoreServerHealth.query(function(result) {          
        console.log(result);
        ctrl.rows = result;
        ctrl.displayedRows = [].concat(ctrl.rows);
        ctrl.isLoading = false;
    });  


}]);

Итак, в заключение я не знаю, для чего нужен st-pipe.

person Richie    schedule 29.10.2015