angular-js指令调用兄弟指令

Question

我想要的是jquery非常简单，但在角度我不知道如何用最好的方法做到这一点。

方案

我点击每个元素中的元素列表（基本上是自定义指令）我通过添加show = true在该元素中显示简单的div。当用户点击列表中的其他元素时，我想隐藏之前显示的div然后显示该特定项目的特定div，现在点击该文件。

$scope.toggleGroup = function(group) {
    if ($scope.isGroupShown(group)) {
      $scope.shownGroup = null;
    } else {
      $scope.shownGroup = group;
    }
  };
  $scope.isGroupShown = function(group) {
    return $scope.shownGroup === group;
  };

找到某种解决方案但仍在寻找最佳方法

Example

Answer 1

我认为你可以在$broadcast范围内写一个$root，它会告诉你所有的图片小工具隐藏他们的div。

像这样（只是草图）：

angular.module('eventExample', [])
    .controller('MyController', ['$scope', function($scope) {
        $scope.hideAll = function () {
            $scope.$broadcast('hideAllEvent');
        };
    }])
    .directive('myImageWidget', function ($scope) {
        $scope.$on('hideAllEvent', function () {
            $scope.show = false;
        });

        $scope.clickMe = function () {
            // Trigger a broadcast from the root scope, so that all widgets
            // listening to the 'hideAllEvent' will set show to false,
            $scope.$root.hideAll();
            // Locally (just in the widget that was clicked) set show to true.
            $scope.show = true;
       };
    });

HTML：

<div ng-controller="MyController">
    <div my-image-widget ng-click="clickMe()" ng-show="show"></div>
    <div my-image-widget ng-click="clickMe()" ng-show="show"></div>
    <div my-image-widget ng-click="clickMe()" ng-show="show"></div>
    ...
</div>

This部分文档具有超强的指导性。