Очистить класс CSS на нумерации строк таблицы

0

У меня есть смарт-стол с разбивкой на страницы. У меня есть контроллер, который применяет класс css к выбранной строке. Поэтому проблема заключается в том, что он сохраняет выделение по индексу на других страницах, поэтому я ищу способ очистить класс, когда я использую или нажимаю разбивку на страницы.

Это таблица:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="TestCtrl">
<div class="smart-table-container">
                <table id="mytable" st-safe-src="dataSet" st-table="displayed" class="smart-table table">
                    <thead>
                    <tr >
                        <th >A COLUMN</th>
                        <th >A COLUMN</th>
                        <th >A COLUMN</th>
                        <th >A COLUMN</th>
                        <th >A COLUMN</th>
                    </tr>
                </thead>

                <tbody data-ng-dblclick="scrollTo()">

                    <tr data-ng-repeat="row in displayed" st-select-row="row" st-select-mode="single" data-ng-click="$parent.setClickedRow($index)" and data-ng-class="{'selected':$index == $parent.selectedRow}">
                        <td data-ng-click="$parent.selData(row);">{{$index}}</td>
                        <td data-ng-click="$parent.selData(row);">{{row.asd}}</td>
                        <td data-ng-click="$parent.selData(row);">{{row.dsa}}</td>
                        <td data-ng-click="$parent.selData(row);">{{row.qwe}}</td>
                        <td data-ng-click="$parent.selData(row);">{{row.ewq}}</td>
                    </tr>
                </tbody>
                    <tfoot>
                        <tr>
                                <td class="text-center" st-pagination="" st-items-by-page="5" colspan="8">
                                </td>
                        </tr>
                    </tfoot>
                </table>
            </div>
       </div>

И это код, связанный с выбором:

angular.module('myApp', []);

function TestCtrl($scope) {
    $scope.selectedRow = null;
    $scope.displayed = [{asd:3},{asd:3},{asd:3},{asd:3},{asd:3},{asd:3}]
    $scope.setClickedRow = function(index){
         $scope.selectedRow = index;
    }
}

И класс css:

.selected {
    background-color: #67BBED;
}
Теги:
pagination
smart-table

1 ответ

0

Включение этого в ваш контроллер может работать

$scope.$watch('displayed', function() {
    $scope.selectedRow = null;
});

http://plnkr.co/edit/hX093vHZkoZSPvfRnqJE?p=preview

Ещё вопросы

Сообщество Overcoder
Наверх
Меню