ui.bootstrap给出多指令资源争用错误

Question

将ui.bootstrap添加到依赖关系列表中，产生以下错误

我如何避免这种情况？
如果需要，请询问更多代码 我删除了下面代码的一大部分，只放了我认为必要的代码 我保留了tab指令的代码（错误中提到的）以及tabset指令所需的tab指令

JS代码段

angular.module("myApp",['ngAnimate','imgSliderDirective','coursesDirective','ui.bootstrap'])

.directive('tab',function(){
    return{
        restrict:'E',
        require:'^tabset',
        transclude:true,
        scope:{
            heading:"@"
        },
        template:'<div ng-show="active" ng-transclude></div>',
        link:function(scope,elem,attr,tabsetCtrl){
            scope.active = false;
            tabsetCtrl.add(scope);
        }
    }
})
.directive('tabset',function($window){
    return{
        restrict:'E',
        scope:{
            item:"=",
            newvar:"@",
            activestyle:"@",
            inactivestyle:"@"           
        },
        transclude:true,
        // require:'^userOptions',
        templateUrl:'/partials/tabset/tabset.html',
        // require:'imageSlider',
        bindToController:true,
        controllerAs:'tabset',
        controller:function(){

            var self = this;
            self.tabs = []
            self.add = function add(tab){
                self.tabs.push(tab);
                if(self.tabs.length === 1){
                    tab.active = true;
                    }
            }

            self.click = function click(selectedTab){
                angular.forEach(self.tabs,function(tab){
                     if(tab.active && tab !== selectedTab) 
                        tab.active = false;             
                })
            selectedTab.active = true;
            }
        },
        link:function(scope,element,attr,ctrl){
            console.log(ctrl.newvar )

            scope.resetInput = function(){
                console.log("in resetInput")
                ctrl.firstBox = "e"
                scope.item = "";
            }

            }
}
})

Answer 1

碰巧ui.bootstrap定义了一个带有隔离范围的指令tab。

当您定义自己的同时使用隔离范围时，您将获得2个指令，要求在同一元素上使用隔离范围，这是不受支持的。

在这方面，ui.bootstrap应该将他们的指令命名为 - 他们没有 - 但你应该：

.directive("dreamerTab", function(){
  // etc...
})
.directive("dreamerTabset", function(){
  // etc..
})