我正在使用AngularJS主页上的标签示例。我基本上只是逐字地删除了这些代码所以它看起来像这样:
app.directive('tabs', function() {
return {
restrict: 'E',
transclude: true,
scope: {},
controller: function($scope, $element) {
var panes = $scope.panes = [];
$scope.select = function(pane) {
angular.forEach(panes, function(pane) {
pane.selected = false;
});
pane.selected = true;
}
this.addPane = function(pane) {
if (panes.length == 0) $scope.select(pane);
panes.push(pane);
}
},
template:
'<div class="tabbable">' +
'<ul class="nav nav-tabs">' +
'<li ng-repeat="pane in panes" ng-class="{active:pane.selected}">'+
'<a href="" ng-click="select(pane)">{{pane.title}}</a>' +
'</li>' +
'</ul>' +
'<div class="tab-content" ng-transclude></div>' +
'</div>',
replace: true
};
});
app.directive('pane', function() {
return {
require: '^tabs',
restrict: 'E',
transclude: true,
scope: { title: '@' },
link: function(scope, element, attrs, tabsCtrl) {
tabsCtrl.addPane(scope);
},
template:
'<div class="tab-pane" ng-class="{active: selected}" ng-transclude>' +
'</div>',
replace: true
};
})
这很有效,除了在IE8中,你点击以更改当前标签的实际标签丢失了,我收到此控制台错误:
Error: No controller: tabs<div class=tab-pane title="Change Log" ng-class="{active: selected}" ng-transclude>
IE8可能出现什么问题?
答案 0 :(得分:0)
在你的指令上,尝试替换restrict:'E',以限制:'A'然后更改所有指令以使用属性。多数民众赞成我如何让http://angular-ui.github.io/bootstrap/中的标签在我正在研究的项目中工作,该项目必须支持IE8。