2015-09-07 3 views
2

У меня есть таблица с возможностью сортировки столбцов (значок заголовка определяет в соответствии с сортировочным существованием и направления):Лучшего способа использовать нг-класс

<table border="1"> 
    <thead> 
     <tr> 
      <th>#</th> 
      <th ng-click="sort(studies, 'PatientName')" class="sortable" 
      ng-class="{'ascending': sortingField == 'PatientName' && sortingDirection == 'asc' , 
         'decending': sortingField == 'PatientName' && sortingDirection == 'desc' }">PatientName</th> 
     </tr> 

Я чувствую, что мое использование в нг-классе плохая практика , как я могу улучшить его?
Как избежать дублирования проверки и не повторять поле «Имя пациента» снова и снова, так как мне нужен другой столбец с разными именами.

много спасибо.

ответ

3

Логическая часть может быть сделано в контроллере:

if (sortingField == "PatientName") { 
    $scope.headerClass = sortingDirection == "asc" ? "ascending" : "descending"; 
    // or even: 
    // $scope.headerClass = sortingDirection + "ending"; 
} 

Затем на ваш взгляд:

<th ng-class="headerClass" ...></th> 
+0

Спасибо, но я по-прежнему необходимо сохранить переменную для каждого столбца, Могу ли я избежать его базы на самом деле только одно поле может быть sortable за один раз –

+0

@DorCohen Вы можете использовать объект: 'ng-class =" headerClass ['PatientName'] "'. Затем ваш контроллер будет запитывать массив. – sp00m

0

Ваш контроллер будет иметь getClass метод, который будет решать класс.

Markup

ng-class="getClass(sortingField, sortingDirection)" 

Код

//this list will be somewhere in controller 
var sortFieldList = ['PatientName', 'PatientAge'] //this list will have multiple elements 
$scope.getClass = function(sortingField, sortingDirection){ 
    var className; 
    if(sortFieldList.indexOf(sortingField) && !sortingDirection) 
    switch(sortingDirection){ 
     case "asc": 
     className = 'ascending'; 
     break; 
     case "desc" 
     className = 'descending'; 
     break; 
    } 
    return className; 
    return ''; 
} 
+2

Почему '' asc "+" end "' trick? Это искусственная зависимость. «switch/case» лучше подходит здесь, IMO. –

+0

@SergioTulentsev спасибо за предложение..Я обновил свой код .. –