javascript - AngularJS中元素溢出时如何发出警报？

Question

我正在创建动态导航选项卡。我有“主页”选项卡(不可关闭)，其内容有一些链接。每个链接都会在新选项卡中打开。当选项卡占据所有可用空间(在我的用例中为 900px)并且仍然单击新选项卡的链接时，用户应该收到警报消息注意:制表符的长度是动态的。

"Close old tabs to open new tabs."

有没有办法判断打开的标签是否会溢出？

<div class="mytabs">
    <ul class="nav-tabs" style="width: 900px; background-color: gray;" >
        <li ng-class="{'active': activeTab === tab.title}"
            ng-repeat="tab in tabs">
            <a  ng-click="onSelectTab(tab.title)">{{tab.title}}</a>
            <span ng-show="tab.isClosable" ng-click="onClose(tab.title)">
                   <i class="left fa fa-times-circle closeButton" ></i>
            </span>
        </li>
        <li class="bd-bottom clearfix"></li>
    </ul>
    <div class="row mytabs">
        <div class="col-lg-12 col-md-12 col-sm-12 tab-content">
            <div ng-transclude class="mytabs"></div>
        </div>
    </div>
</div>

请指导..提前致谢。

Answer 1

我不知道是否有这样的函数，但你可以尝试用一些简单的数学来实现:假设选项卡为 50px；

If (number_of_tab * 50 > 900)
alert("Close old tabs to open new tabs.");

希望有帮助。