如何根据 table 大小定位下拉菜单或下拉菜单

How to position dropdown or drop up according to table size

我在 table 中有下拉菜单,如果该行下方的 table 中没有 space,我需要将其更改为下拉菜单。我怎样才能实现它?有人可以帮忙吗 示例代码 http://jsfiddle.net/mhu23/YZx7R/22/

<div ng-controller="MyCtrl">
<div class="container">
    <div class="row">
        <div class="span2">
            <table class="table">
                <tr ng-repeat="row in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24]">
                    <td> <a>{{row}}</a>

                    </td>
                    <td>
                        <ul class="nav">
                            <!-- To create dropups instead of dropdowns i could add the class "dropup" to the li-element below. -->
                            <!-- But what I need is an inteligent mechanism that decides when to use dropdown and when to use dropup -->
                            <li class="dropdown pull-right"> <a class="btn-link dropdown-toggle">
                                <i class="icon-align-justify"></i>
                            </a>

                                <ul class="dropdown-menu">
                                    <li ng-repeat="menu in [1,2,3]"> <a class="btn-link">{{menu}}</a>

                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</div>

使用$last属性

类似于:

<li class="dropdown pull-right"
     ng-class="{'dropup':$last}"> 

Fixed Fillde


如果需要最后2个,可以这样写:

ng-class="{'dropup': $index >= items.length-2}"

其中 items=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24]

Fiddle 2