AngularJS标签示例和IE8

时间:2012-11-12 18:35:22

标签: javascript angularjs

我正在使用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可能出现什么问题?

1 个答案:

答案 0 :(得分:0)

在你的指令上,尝试替换restrict:'E',以限制:'A'然后更改所有指令以使用属性。多数民众赞成我如何让http://angular-ui.github.io/bootstrap/中的标签在我正在研究的项目中工作,该项目必须支持IE8。