Q:

AngularJS - hide a div when clicking in an inner element using a directive

I'm trying to hide a box when clicking on a link inside this box.
I wan't to use a directive to be able to add more code when once the box is hiden and to keep it generic so I can use that with other views.
I've tried to use isolated scope but I guess I did it the wrong way.
Here is a fiddle link : http://jsfiddle.net/rJvqf/
I have a in my controller :
$scope.hideLoginBox = false;

In my view I have a div with ng-hide="hideLoginBox"
<div ng-app="MyApp">
  <div ng-controller="MyController">
    <div class="base" ng-hide="hideLoginBox">
        <p>outer</p>
            <div class="child">
                <a href="" my-test="" hidebox="hideLoginBox" >
                    innner
                </a>
            </div>
    </div>
  </div>
</div>

When I click on the link I want to hide this div using the directive myTest.
I can't figure out how to do this.
Thanks for your help!
Regards,
Eric

A:

Nearly there.  You just needed a scope.$apply because you were in an element's bind event and I changed it to bind to click instead of mousedown.
Here is a working jsfiddle.
Changes:
  element.on('click', function(event) {
    scope.hideLoginBox = true;
    scope.hidebox = true;
    scope.$apply();
    console.log(scope);   
  });

