我在bootstrap中有以下子选项卡，带有下拉列表的子选项卡在选择时不会突出显示。

<ul class="nav nav-tabs" role="tablist">
    <li class="nav-item">
        <a data-toggle="tab" ng-class="'nav-link active'" ng-click="clickTab('tab1')" role="tab" href>
        <i style="color:grey" class="fas fa-info-circle pr-1"></i>Tab1</a>
    </li>
        <li class="nav-item dropdown">
            <a data-toggle="dropdown" class="nav-link dropdown-toggle" role="tab" href>
            <i style="color:grey" class="fas fa-calculator pr-1"></i>Dropdown Main</a>
            <div class="dropdown-menu">
                <a class="dropdown-item" ng-click="clickTab('subtab1')" >Dropdown1</a>
                <a class="dropdown-item" ng-click="clickTab('subtab2')">Dropdown2</a>
            </div>
        </li> 
        ...
</ul>

因此，如果我选择dropdown1/2，则tab dropdown main不会突出显示，或者该类似乎没有活动。我该如何解决这个问题？这是在angularjs应用程序中，所以我不能使用jquery动态分配它。