3

早上好，我的 angualrJS 水疗中心有一张智能表，但我需要将搜索字段放在表外以进行 ui 设计。可以做到吗？这是我的表的示例代码

<table st-table="displayedCollection" st-safe-src="rowCollection" class="table table-striped">        
  <thead>
    <tr>
      <th>Tipo</th>
      <th>Da</th>
      <th>A</th>
      <th>Data</th>
      <th>Durata</th>
      <th>Costo</th>
    </tr>
    <tr>
      <th></th>
      <th></th>
      <th><input st-search="'destination'" /></th>
      <th><input st-search="'answerTime'" /></th>
      <th><input st-search="'duration'" /></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="row in displayedCollection">
      <td></td>
      <td></td>
      <td>{{row.destination}}</td>
      <td>{{row.answerTime | date : 'short'}}</td>
      <td>{{row.duration | number}}</td>
      <td>{{row.cost | currency : '€'}}</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td colspan="5" class="text-center">
        <div st-pagination="" st-items-by-page="itemsByPage" st-displayed-pages="5"></div>
      </td>
    </tr>
  </tfoot>
</table>

我需要将 st-search 字段（或类似的东西）放在标签之外。

这里是示例，顶部默认，底部需要

http://imgur.com/C24pk0K

4

1 回答 1

2

您可以尝试将表格包装在这样的包装器中：

<div st-table="displayedCollection" st-safe-src="rowCollection">

   <input st-search="'destination'" />
   <input st-search="'answerTime'" />
   <input st-search="'duration'" />

   <table class="table table-striped">
      <thead>
         <tr>
            <th>Tipo</th>
            <th>Da</th>
            <th>A</th>
            <th>Data</th>
            <th>Durata</th>
            <th>Costo</th>
         </tr>
      </thead>
      <tbody>
         <tr ng-repeat="row in displayedCollection">
            <td></td>
            <td></td>
            <td>{{row.destination}}</td>
            <td>{{row.answerTime | date : 'short'}}</td>
            <td>{{row.duration | number}}</td>
            <td>{{row.cost | currency : '€'}}</td>
          </tr>
      </tbody> 
    </table>
 </div>

对我来说，这很完美。

于 2017-11-17T13:43:55.653 回答