要正确关闭AngularJS UI Bootstrap标签页,可以使用以下代码示例进行解决:
HTML代码:
Content of Tab 1
Content of Tab 2
JavaScript代码:
angular.module('app', ['ui.bootstrap'])
.controller('TabController', function($scope) {
$scope.activeTab = 0;
$scope.closeTab = function(index) {
// 关闭指定索引的标签页
$scope.activeTab = index !== $scope.activeTab ? $scope.activeTab : index - 1;
};
});
在上述代码中,我们使用了ng-click
指令将关闭按钮绑定到closeTab
函数上。该函数会接收一个索引参数,表示要关闭的标签页的索引。在closeTab
函数中,我们将检查当前活动的标签页索引是否与要关闭的索引相同。如果是,则将活动标签页更改为前一个标签页,否则保持不变。这样,我们就可以正确关闭标签页了。
请注意,上述代码使用了uib-tabset
和uib-tab
指令来创建标签页。确保已正确引入AngularJS UI Bootstrap库,并将app
模块作为应用程序的依赖项。