angularjs - 嵌套指令中的angularjs ng-class

Question

尝试了很多不同的方法，仍然无法弄清楚这一点。我在嵌套指令的模板中有一个带有 ng-class="{menuVisibleAnimation: menuOpen}" 的菜单。当我单击父指令中的按钮时，我想将 menuOpen 的值更改为 true，但子指令中的菜单没有更新？

http://plnkr.co/edit/nOunKkch0Gt8hjMWtruA?p=preview

Answer 1

您的实现中的主要问题是您希望使用 $scope 在父指令和子指令之间共享 menuOpen 的值，但您的父指令具有隔离范围：

scope: {
  menuOpen: '@menuOpen'
}

您需要在两个指令共享的范围内声明 menuOpen，由于包含，它必须是父指令的父范围。因此，在父指令中，您不应创建新范围：

scope: false,
link: function($scope) {      
  $scope.menuOpen = false;
  $scope.toggleMenu = function() {
    $scope.menuOpen = !$scope.menuOpen;
  };
}

然后，可以在子指令中访问 openMenu。在你的Plunker的一个分支中看到它。