指令不正确初始化

Question

我使用angular-ui-bootsrap tabs指令创建选项卡。但是当我在每个控制器和链接功能上使用console.log时，初始化顺序不正确。

我期待

B

结果

F

正如您所看到的，外部指令同时初始化与控制器的链接，而不是在内部指令初始化之后进行链接。

转到plunker并检查控制台。

Answer 1

将你的链接功能放在$ timeout服务中。请参阅plunker

＆＃13;

＆＃13;

// 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
    }
  };
})

＆＃13;

＆＃13;

＆＃13;

Answer 2

我发现了这个问题。导致此问题的是ng-repeat。但是我会问另一个关于这个问题的问题。