如何使用角度元素将行粘贴到页面顶部

时间:2017-04-29 14:03:42

标签: javascript angularjs flexbox

我有一张桌子,上面有三个按钮。当我向下滚动但是它不起作用时我想看到按钮和表格的第一行。请告诉我我该怎么做。 首先我按下按钮:

<div layout="row">
  <md-button class="md-fab md-mini"  ng-click="addSale()">
    <md-icon>add</md-icon>
  </md-button>
  <md-button class="md-fab md-mini"  ng-click="returnSale()">
    <md-icon>remove</md-icon>
  </md-button>
  <md-button class="md-fab md-mini"  ng-click="save()">
    <md-icon>save</md-icon>
  </md-button>
</div>

然后放桌子:

<md-card>
  <md-card-content>
    <div layout="column">
      <md-table-container>
        <table md-table md-row-select multiple 
          ng-model="selectedEntities" 
          md-progress="entityPromise"
          flex="auto">
          <thead md-head>
            <tr md-row flex>
              <th md-column><span></span></th>
              <th md-column><span>1</span></th>
              <th md-column><span>2</span></th>
              <th md-column><span>3</span></th>
            </tr>
          </thead>
          <tbody md-body>
            <tr md-row
              md-select="detail"
              md-select-id="rms_commodityid"
              ng-repeat="detail in invoiceDetails"
              flex="noshrink">
              <td md-cell>
                <md-icon ng-if="!detail.isReturn" ng-style="{color:'green'}">done</md-icon>
                <md-icon ng-if="detail.isReturn" ng-style="{color:'red'}">clear</md-icon>
              </td>
              <td md-cell>{{$index + 1}}</td>
              <td md-cell>
                <md-input-container md-no-float class="md-block">
                <md-autocomplete flex required
                  md-selected-item="detail.commodity"
                  md-search-text="searchCommodityText"
                  md-selected-item-change="readPrice(detail)"
                  md-item-text="item.rms_commodity_name"
                  md-items="item in searchCommodity(searchCommodityText)"
                  md-min-length="0"
                  md-floating-label="*">
                <md-item-template>
                  <span>
                    {{item.rms_commodity_name}}
                  </span>
                </md-item-template>
                <td md-cell>
                  <md-input-container md-no-float class="md-block">
                    <input ng-model="detail.unitPrice" type="number" placeholder="قیمت واحد">
                  </md-input-container>
                </td>
              </tr>
            </tbody>
          </table>
        </md-table-container>

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

 <td md-cell>
    <md-input-container md-no-float class="md-block">
        <md-autocomplete flex required
                            md-selected-item="detail.commodity"
                            md-search-text="searchCommodityText"
                            md-selected-item-change="readPrice(detail)"
                            md-item-text="item.rms_commodity_name"
                            md-items="item in searchCommodity(searchCommodityText)"
                            md-min-length="0"
                            md-floating-label="*">
            <md-item-template>
                <span>
                    {{item.rms_commodity_name}}
                </span>
            </md-item-template>
</td>