親ディレクティブと子ディレクティブとの間で引数を渡す

Question

ナビゲーションメニュー用のparentディレクティブとメニューリンク用のchildディレクティブがあります。

<menu> 
    <menu-link /> 
    <menu-link /> 
</menu> 

私はng-translucentを使ってhtmlを追加することができます。 メニューからすべてのメニューリンク要素に引数を渡す方法はありますか？例えば 、場合：私はすべてのメニューリンクディレクティブは親からその値を取得したい

<menu ng-disabled='true'.. 

。 もう1つ：各メニューリンクには独自の属性があるため、独自のスコープが必要です。

Answer 1

requireを利用できます。詳しくは、angular directiveのドキュメントをご覧ください。美しく見える

angular.module('myApp', []) 
 
    .controller('MyController', MyController) 
 
    .controller('MyDirectiveController', MyDirectiveController) 
 
    .directive('myDirective', myDirective) 
 
    .directive('childDirective', childDirective) 
 

 
function MyController($scope) { 
 

 
} 
 

 
function MyDirectiveController($scope) { 
 
    this.isDisabled = function() { 
 
    return $scope.disabled; 
 
    }; 
 
} 
 

 
function myDirective() { 
 
    return { 
 
    restrict: 'E', 
 
    transclude: true, 
 
    template: '<div>myDirective Disabled: {{ disabled }}<ng-transclude></ng-transclude></div>', 
 
    scope: { 
 
     disabled: '=?ngDisabled' 
 
    }, 
 
    controller: 'MyDirectiveController' 
 
    }; 
 
} 
 

 
function childDirective() { 
 
    return { 
 
    restrict: 'E', 
 
    require: '^^myDirective', 
 
    template: '<div>childDirective disabled: {{ disabled }}</div>', 
 
    scope: {}, 
 
    link: function(scope, elem, attrs, myDirectiveCtrl) { 
 
     scope.disabled = myDirectiveCtrl.isDisabled(); 
 
    } 
 
    }; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> 
 

 
<div ng-app="myApp"> 
 

 
    <div ng-controller="MyController"> 
 
    <my-directive ng-disabled="true"> 
 
     <child-directive></child-directive> 
 
     <child-directive></child-directive> 
 
    </my-directive> 
 
    </div> 
 

 
</div>