Почему крах текста соседней строки?

Question

Мне нужно показать все данные каждого столбца без использования многоточия. Фактически мои данные сворачиваются с соседней строкой. Как показать все данные в строке? Фактически текст столбца будет большим (не знаю, длина текста будет поступать с сервера). Но мне нужно показать весь текст. Скажите, пожалуйста, как показать весь текст столбца. вот мой код

<div id="scrollingTable" ng-if="isservicedataloadedProperly"> 
      <ion-scroll overflow-scroll="true" ng-style="viewHeight"> 
       <div class="row brd rowclass" collection-repeat="column in tasklist_records track by $index" ng-class="{white:$index%2 == 0,grey:$index%2 == 1,firstrow:$first}" collection-item-height="40"> 

        <div class="col brbrdleft_right dleft_right col-10 text-center"></div> 
       </div> 
       <div ng-if="!haveNorecordFound" class="norecordfoundcss"> No record found.</div> 
      </ion-scroll> 
     </div> 

Update:

Уже используют CSS высоты

/* Styles go here */ 

.rowclass { 

    height:50%; 
} 

Ничего работы ..

Answer 1

у меня создалось впечатление от ваших коллег, на основе по предыдущим вопросам/ответам, что мобильные устройства не были вашей основной целью. Я пришел к такому выводу, потому что неоднократно отмечал, что Ionic оптимизирован для приложений, поставляемых на мобильные устройства, и, таким образом, элементы пользовательского интерфейса были разработаны для прикосновения, поэтому не рекомендуется изменять размеры заголовков, кнопок и других сенсорных объектов. Я также отметил, что большие сетки табличных данных не способствуют отображению на мобильных устройствах и создают очень плохое удобство использования.

У меня никогда не было объяснений, почему вы продолжаете свой подход к дизайну, несмотря на эти моменты, поэтому мне оставалось предположить, что мобильные устройства не являются вашей целью. Если это верно (что вы не проектирование мобильного или отзывчивое приложения), то вот несколько вариантов:

1. Используйте таблицу. Я рекомендовал это раньше Паллави. Учитывая, что ваши данные носят табличный характер, таблица имеет большой смысл. Кроме того, существуют такие решения, как UI Grid, которые могут предлагать некоторые из возможностей поддержки сложных наборов данных и предоставляют множество встроенных функций для сортировки и поиска столбцов, разбиения на страницы, группировки и сводные строки. Это медведь для использования, но в зависимости от ваших требований, это стоит знать (опять же, предполагая, что вы не строите для мобильных устройств).

2. Не используйте повторение коллекции и вместо этого выберите ng-repeat. Директива collection-repeat предназначена для доставки больших наборов данных до мобильных устройств. Цель состоит в том, чтобы обеспечить лучшую производительность на устройствах с более низким питанием с меньшим разрешением экрана. В результате, collection-repeat ONLY отображает элементы коллекции, которые являются актуальными. Чтобы сделать это эффективно, директива должна иметь согласованную высоту строки, чтобы она могла вычислять количество видимых элементов. Я попробовал и протестировал несколько подходов, чтобы обойти это, но в итоге простой ответ был самым результативным: вместо этого используйте ng-repeat. Вы можете значительно улучшить производительность ng-repeat с использованием one-time bindings и фильтров, которые могут компенсировать прирост производительности, предлагаемый методом сбора-повтора.

Особенно, если я ошибаюсь в отношении мобильной части, вы должны подумать, что третий вариант - полностью изменить вектор пользовательского интерфейса. Это не мое дело, но у меня есть 25-летний опыт проектирования и создания корпоративных программных продуктов, поэтому я бы отказался, если бы не заметил, что ваш текущий дизайн пользовательского интерфейса является не чем иным, как нефункциональной версией MS Excel. Где преимущество для пользователя? Как увидеть около 5000 записей в разбивке на страницы, чтобы помочь им воздействовать на эти данные в контексте их работы? Лично я пересматриваю свои персоны (или фактические заинтересованные стороны) и задаю эти два вопроса. Вы можете обнаружить, что лучший подход - это отказаться от всего и заменить его другим пользовательским интерфейсом (таким как интерфейс поиска или интерфейс списка).На самом деле я делал макет двух альтернативных подходов, но после тестирования я решил, что усилия и дополнительные привязки не имеют смысла в контексте настольного приложения. Итак, опять же, в контексте того, что я понимаю ваши требования, я рекомендую два варианта выше.