Директива обязательна не определена

Question

Я немного новичок в angularjs. Я пишу директиву, но я не понимаю, как работает bindToController. Я прочитал эту полезную статью http://blog.thoughtram.io/angularjs/2015/01/02/exploring-angular-1.3-bindToController.html, но я не могу понять, почему в следующем примере я не определился.

.directive('firstDirective', function(){ 
    return { 
     restrict: 'E', 
     replace: true, 
     scope: true, 
     bindToController: { 
      directiveInput:'=' 
     }, 
     templateUrl: 'components/directive-tree/directive-tree.html', 
     controllerAs: 'directiveTreeCtrl', 
     controller: function($scope, $uibModal){ 
      var self = this; 
      self.selected = null; 
      console.log(self.directiveInput); //HERE IS THE UNDEFINED 
      $scope.modalOptions = { 
       windowClass: 'semi-modal', 
      } 

      this.openDirectiveModal = function(object, index) { 
       //Other irrelevant code 
      } 
     } 
    } 
}); 

После этого я могу использовать вход для шаблона HTML без каких-либо проблем.

<ul> 
    <li ng-repeat="object in directiveTreeCtrl.directiveInput"> 
     {{object.Id}}&emsp;{{object.Name}} 
    </li> 
</ul> 

Почему в шаблоне HTML можно использовать directiveInput и это экземпляр с правильными значениями и мой console.log показать мне «не определено»?

Возможно, это глупый вопрос. Спасибо

Answer 1

Как правило, код, который я пишу для достижения этой цели выглядит так:

.directive('firstDirective', function(){ 
    return { 
     restrict: 'E', 
     replace: true, 
     scope: { 
      directiveInput:'=' 
     }, 
     bindToController: true, 
     templateUrl: 'components/directive-tree/directive-tree.html', 
     controllerAs: 'directiveTreeCtrl', 
     controller: function($scope, $uibModal){ 
      var self = this; 
      self.selected = null; 
      console.log(self.directiveInput); //HERE IS THE UNDEFINED 
      $scope.modalOptions = { 
       windowClass: 'semi-modal', 
      } 

      this.openDirectiveModal = function(object, index) { 
       //Other irrelevant code 
      } 
     } 
    } 
}); 

теперь HTML

<first-directive directive-input="inputObject"></first-directive>