NG-バインドがカスタムディレクティブ

Question

とラベルに機能していない私は、次のように、ラベルの説明をヒントアイコンを追加するためのディレクティブを作成しました：

 propertyWindowModule.directive('hintIcon', { 
     restrict: 'A', 
     controller: HintIconController, 
     controllerAs: 'vm' 
    }); 

    class HintIconController { 
     static $inject = ['$element', '$timeout']; 
     constructor(private $element:ng.IRootElementService, 
        private $timeout: ng.ITimeoutService) { 
      if(!_.isEmpty(this.$element.attr('hint-icon'))) { 
       this.$element.attr('title', this.$element.attr('hint-icon')); 
       this.$element.append($('<i class="tooltip-icon glyphicon glyphicon-question-sign">').attr('title', this.$element.attr('hint-icon'))); 
      } 
     } 
    } 

そして、私はそれを使用して、いくつかのビューでラベルに：

<label ng-bind="vm.label" hint-icon="test icon"></label> 

ng-bindが動作していないが、hint-iconはうまく機能 - 私はしかし、ラベルなし、ツールチップで説明のアイコンを参照してください。

Answer 1

実際に要素に2つのディレクティブを定義すると、例外がスローされます。「1つのスコープに対して複数のディレクティブ」！したがって、ヒントアイコンディレクティブで独自のng-bindを定義する必要があります。

<label hint-icon="test icon" hint-icon-bind="vm.label"></label> 

propertyWindowModule.directive('hintIcon', { 
    restrict: 'A', 
    scope: { 
     hintIconBind: '=' 
    }, 
    controller: HintIconController, 
    controllerAs: 'vm' 
}) 

そして、あなたはあなたのようなコントローラーでそれを使用します。

scope.vm.hintIconBind