Angular: Dropdown / Dropup

http://angularjs.org/

HTML

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.4.0.js"></script>
<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="dropup 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>

JavaScript

var myApp = angular.module('myApp', ['ui.bootstrap']);

function MyCtrl($scope) {


}