css - Angular と Bootstrap UI タブの両方がアクティブになり、デフォルトを防止

Question

Angular UI-Tab の使用中に CSS の問題が発生しました。問題は、2 つのタブを取得するシナリオがあることです。いくつかの条件に基づいてタブの切り替えを防ぐ必要があります。

そのために、デフォルトの防止を使用していました。したがって、イベント CSS を防止すると、両方のタブがアクティブであることが示されます。クリックが始まったばかりで途中で止まったからです。

私のHTML私たち：

<uib-tabset>
    <uib-tab index="1">
    <uib-tab-heading>Search</uib-tab-heading>
        <div class="PL_7 PR_7">
            <div class="clearfix">
                search tab
            </div>
        </div>
    </uib-tab>
    <uib-tab index="2" ng-click="ctrl.activateOrderBinTab()" deselect="ctrl.tabSelected($event)">
    <uib-tab-heading>Order</uib-tab-heading>
        <div class="PL_7 PR_7">
            order tab
        </div>
    </uib-tab>
</uib-tabset>

そしてdeselect()関数は

 function tabSelected($event) {
        var unsavedRows = angular.element('.dx-cell-modified');
        if (unsavedRows.length > 0) {
            $event.preventDefault();
            NotifyToastService.showError(gettext("Please save or cancel changes to the order bin to add items"));
        }
    }

私がこれを試したとき、何が起こるかは

必要なもの

これを防ぐにはどうすればよいか教えてください。