0

I使用angular-ui-bootsrap選項卡指令創建選項卡。但是當我在每個控制器和鏈接函數上使用console.log時,初始化順序不正確。指令未正確啓動

我希望

outer - controller 
Inner - Controller 
Inner - Link 
Inner - Controller 
Inner - Link 
Inner - Controller 
Inner - Link 
Inner - Controller 
Inner - Link 
outer - Link 

結果

outer - controller 
outer - Link 
Inner - Controller 
Inner - Link 
Inner - Controller 
Inner - Link 
Inner - Controller 
Inner - Link 
Inner - Controller 
Inner - Link 

正如你所看到的外部指令已經初始化與控制器連接在同一時間,而不是內後連接指令已經初始化。

轉到plunker並檢查控制檯。

回答

1

把你的鏈接函數放在$ timeout服務中。見plunker

// UPD: Add $timeout service 
 
.directive('uibTabset', function($timeout) { 
 
    return { 
 
    transclude: true, 
 
    replace: true, 
 
    scope: {}, 
 
    bindToController: { 
 
     active: '=?', 
 
     type: '@' 
 
    }, 
 
    controller: 'UibTabsetController', 
 
    controllerAs: 'tabset', 
 
    templateUrl: function(element, attrs) { 
 
     return attrs.templateUrl || 'uib/template/tabs/tabset.html'; 
 
    }, 
 
    link: function(scope, element, attrs) { 
 
     // UPD: put link-function in $timeout 
 
     $timeout(function() { 
 
     console.log("outer - Link"); 
 
     
 
     scope.vertical = angular.isDefined(attrs.vertical) ? 
 
      scope.$parent.$eval(attrs.vertical) : false; 
 
     scope.justified = angular.isDefined(attrs.justified) ? 
 
      scope.$parent.$eval(attrs.justified) : false; 
 
     if (angular.isUndefined(attrs.active)) { 
 
      scope.active = 0; 
 
     } 
 
     }); 
 
     // END UPD 
 
    } 
 
    }; 
 
})

+0

超時會起作用,但有沒有比超時更清潔的方法?爲什麼會發生這種情況? –

0

我已經找到了問題。這是造成這個問題的ng重複。不過,我會問關於這個問題的另一個問題。