Ъглов материал - използване на атрибути за скриване

Имам проблем с използването на hide- атрибутите, предоставени с ъглов материал на таблица, където се опитвам да скрия колони в определени точки на прекъсване.

Имам много прост пример за таблица, където клетките на заглавката и реда използват атрибути за скриване като така:

<md-card layout="row">
      <table class="main-table" layout-fill flex layout="column">
        <thead flex>
          <tr layout="row">
            <th flex hide-sm>Status</th>
            <th flex hide-md>Value</th>
            <th flex hide-md>Type</th>
            <th flex hide-sm>Action</th>
            <th flex hide-md>Card Number</th>
            <th flex>Customer</th>
            <th flex>Contact</th>
          </tr>
        </thead>
      <tbody flex>
        <tr layout="row" ng-repeat="message in vm.messageListFailures" class="pointer">
          <td flex hide-sm>
            <span class="status-label message-status-failed">Never Sent</span>
          </td>
          <td flex hide-md>
            £3500
          </td>
          <td flex hide-md>
            Bla
          </td>
          <td flex hide-sm>
            Added
          </td>
          <td flex hide-md>
            12345678910
          </td>
          <td flex>
            Mr John Smith
          </td>
          <td flex>
            [email protected]
          </td>
        </tr>
      </tbody>
    </table>
  </md-card>

Работещ codepen

Когато преоразмерявам панела за предварителен преглед в моя образец на codepen, колоните не се скриват при малки и средни точки на прекъсване. Също така забелязах, че таблицата всъщност не запълва наличната ширина на картата, добавих layout-fill и flex към елемента table, но това няма значение.

Какво ми липсва тук?

Благодаря


angularjs angular-material
person mindparse    schedule 21.12.2015    source източник

Отговори (1)


arrow_upward
1
arrow_downward

вижте следния блок. работи,

 <tr layout="row">
        <th  flex class="ng-hide">Status</th>
        <th  flex  class="ng-hide">Value</th>
        <th  flex class="ng-hide">Type</th>
        <th  flex  class="ng-hide">Action</th>
        <th  flex class="ng-hide">Card Number</th>
        <th  flex>Customer</th>
        <th flex>Contact</th>
  </tr>
person Nitin Dhomse    schedule 21.12.2015
comment
Благодаря, че проработи! Изглежда, че документите и примерите, които съм виждал, използват атрибути, а не имена на класове. Използвам версия 0.11.2, може би последната версия 1.0+ се е променила? - person mindparse; 21.12.2015