有没有办法告诉哪个选项卡在
Angular UI中使用Bootstrap选项卡时被选择?
我试图看着窗格数组,但它似乎在切换标签时更新。当选择选项卡时,是否可以指定回调函数?
使用代码示例更新。
标记:
<div ng-controller="TabsDemoCtrl"> <tabs> <pane ng-repeat="pane in panes" heading="{{pane.title}}" active="pane.active"> <div ng-include="pane.template"></div> </pane> </tabs> </div>
控制器:
var TabsCtrl = function ($scope) { $scope.panes = [ { title:"Events list",template:"/path/to/template/events" },{ title:"Calendar",template:"/path/to/template/calendar" } ]; };
实际上这很简单,因为每个窗格显示支持双向数据绑定的活动属性:
<tabs> <pane ng-repeat="pane in panes" heading="{{pane.title}}" active="pane.active"> {{pane.content}} </pane> </tabs>
然后可以很容易地找到活动选项卡,例如:
$scope.active = function() { return $scope.panes.filter(function(pane){ return pane.active; })[0]; };
这里是一个工作plunk:http://plnkr.co/edit/fEvOtL?p=preview