<!DOCTYPE html>
<html>
<head>
<Meta name="viewport" content="width=device-width" />
<title>TabsIndex</title>
<link href="~/Content/bootstrap.css" rel="stylesheet" />
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/ui-bootstrap-tpls.js"></script>
<script>
angular.module('ui.bootstrap.demo',['ui.bootstrap'])
.controller('TabsDemoCtrl',function ($scope,$window) {
$scope.tabs = [
{ title: '标签页a',content: '标签页a的内容' },{ title: '标签页b',content: '标签页b的内容',disabled: true }
];
$scope.alertMe = function () {
setTimeout(function () {
$window.alert('clicked!');
});
};
});
</script>
</head>
<body ng-app="ui.bootstrap.demo">
<div ng-controller="TabsDemoCtrl">
<uib-tabset active="active" type="tabs">
<uib-tab index="0" heading="标签页1">内容1</uib-tab>
<uib-tab index="$index + 1" ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disable="tab.disabled">
{{tab.content}}
</uib-tab>
<uib-tab index="3" select="alertMe()">
<uib-tab-heading>
<i class="glyphicon glyphicon-bell"></i> Alert!
</uib-tab-heading>
内容部分
</uib-tab>
</uib-tabset>
</div>
</body>
</html>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
