title: Communication between child and parent directive
body: <p>I'm trying to figure out how to make a child directive communicate with it's parent directive</p>
  
  <p>I basically have this html markup</p>
  
  <pre><code>&lt;myPanel&gt;
      &lt;myData dataId={{dataId}}&gt;&lt;/myData&gt;
  &lt;/myPanel&gt;
  </code></pre>
  
  <p>In the myData directive, if there is no data available, I want to hide the myPanel.</p>
  
  <p>In the myData directive controller I've tried</p>
  
  <pre><code>$scope.$emit('HideParent');
  </code></pre>
  
  <p>And in the myPanel controller I've tried</p>
  
  <pre><code>$scope.$on('HideParent', function () { $scope.hide = true; });
  </code></pre>
  
  <p>And also </p>
  
  <pre><code>$scope.$watch('HideParent', function () { if (value) { $scope.hide = true; }});
  </code></pre>
  
  <p>In either situation, the myPanel directive isn't receiving the $emit</p>