Javascript Angularjs指令将变量传递给子指令

在我的Angularjs项目中，我遇到了指令嵌套和变量传递的问题

我做了一个指令头：

.directive('header', [function() {
    return {
        restrict: 'E',
        scope: {},
        templateUrl: 'header.tpl.html',
        link: function(scope, elem, attrs) {
            scope.showDescriptions = false;
            scope.expandDescriptions = function() {
                ...
                scope.showDescriptions = !scope.showDescriptions;
            }
        }
    }
}

在模板中，使用另一个指令：

<div class="description" votable show-vote="showDescriptions"></div>

.directive('votable', [function() {
    return {
        restrict: 'A',
        scope: {
            showVote: '='
        },
        templateUrl: 'votable.tpl.html',
    }
}

在votable.html中：

<div class="vote" ng-show="showVote"></div>

当我运行此操作时，投票图标应该隐藏以开始，但它正在显示

我有另一个元素+指令组合：

<div expandable expand="expandDescriptions" ng-show="showDescriptions"></div>

此指令在开始时隐藏，但在展开后，即使切换showDescriptions变量，也无法折叠

---

我是否需要做一些特殊的事情来将变量从指令的作用域传递到子指令的作用域？

对于嵌套指令，子指令将在运行父指令的链接函数之前进行数据绑定。如果需要在父范围中有一些值可用，以便正确呈现子指令，则需要在父指令的preLink中绑定该值。添加一个编译函数，使其返回您的preLink函数，该函数应该很好，如下所示：

compile: function() {
    return {
        pre: function preLink(scope, elem, attrs) {
            scope.showDescriptions = false;
            scope.expandDescriptions = function() {
            ...
            scope.showDescriptions = !scope.showDescriptions;
        }
    }
}

---

你的例子很好用，我想我把代码简化了一点。等我有更多时间的时候，我会加强的。我注意到的一个问题是，在sub指令的链接时，showsdescriptions属性没有被解析为变量，而是作为字符串“showsdescriptions”传递给sub指令。我刚刚理解了它，但我无法真正解释它。通过作用域的变量不知何故被一个带有display:block！的转换CSS类打断了！重要的；。删除css类（它与指令无关），使作用域如我所期望的那样工作。