Angularjs and bootstrap pagination не скрывает divs правильно

Я использую Angularjs и pagination для отображения нескольких div. Затем я скрываю div, основываясь на некоторых критериях. См. Код exract нижеAngularjs and bootstrap pagination не скрывает divs правильно

   <div class="DataItem" dir-paginate="x in parametersToDisplay | orderBy:'Name' | filter:textFilter | itemsPerPage: pageSize" current-page="currentPage" ng-hide="x.DetailLevel > detailLevel">     
        <label id="lblParameterName{{x.ConfigId}}" class="DataItemLabel">{{x.Name}}</label> 
        <label id="lblDescription{{x.ConfigId}}" class="DataItemLabel">{{x.Description}}</label> 
        <label id="lblUnits{{x.ConfigId}}" class="DataItemUnits">{{x.Units}}</label> 
        <input id="txtParameterValue{{x.ConfigId}}" class="DataItemValue" type="text" ng-blur="CheckCongigValue($event, x)" value="{{x.Value}}" /> 
       </div> 
      </div>

Проблема в том, что разделители, которые должны быть скрыты, не видны, но они по-прежнему занимают пространство. Если я удалю разбивку на страницы и просто использую div с ng-repeat, он отлично работает, и скрытые divs полностью исчезнут.

Я прочитал, что bootstrap css для скрытого использования отображает: скрывает и перезаписывает angularjs css, который использует display: none. Я также считаю, что это можно переопределить, чтобы исправить проблему, но я пробовал несколько вещей и, похоже, не могу ее обработать.

Может ли кто-нибудь дать мне простой пример, показывающий, как это сделать.

Спасибо заранее!

источник

2015-07-07 ee0jmt

вы должны использовать ng-if вместо ng-show/hide.

Директива ngIf удаляет или воссоздает часть дерева DOM на основе выражения. Если выражение, присвоенное ngIf, оценивается как ложное значение, тогда элемент удаляется из DOM, иначе клон элемента снова вводится в DOM.

Good explaination here

источник

2015-07-07 15:18:08 ThomasP1988

Спасибо за ваш ответ, но если я заменил ng-show на ng-если ничего не будет показано. Если я заменю критерии на true или false, это будет работать. Мои критерии работают с ng-show. – ee0jmt

вам нужно адаптировать критерии, ng-if положителен, ng-hide - отрицательный. Поэтому попробуйте ng-if = "x.DetailLevel <= detailLevel" – ThomasP1988

Мне удалось разобраться в моих критериях, но теперь ng-if делает то же самое, что и ng-show, и оставляет пробелы, где скрытые div. Я уверен, что мне нужно переопределить bootstrap css, поскольку он определяет шкуру по-разному, но не уверен, как это сделать? – ee0jmt

В конце концов я manaed, чтобы исправить это путем создания нового массива witht отфильтрованных параметров, которые я хотел показать, а затем применяется это к пагинацией.

Это не лучшее решение, но оно работает.

источник

2015-07-08 10:42:57 ee0jmt

Angularjs and bootstrap pagination не скрывает divs правильно

ответ

Смежные вопросы