javascript - Hvordan bruke $location i direktiver i AngularJs

Jeg lager en direktiv der onclick tar brukeren til en annen side. Litt som en tilpasset "href"-tagg. Jeg håpet at $location ville ta seg av omdirigeringsfunksjonen, men av grunner jeg ikke vet enda, fungerer dette ikke. Hvis jeg bruker $location i en kontroller, fungerer det, men fra innenfor en direktiv gjør det ikke det. Her er koden:

angular.module("myAPP")
    .directive('hpHref', ['$location' , function($location){
        return {
            restrict : "A",
            link : function(scope, el, attr) {
                    el.bind('click', function(){
                        // more logic
                        console.log("Code reaches here:");
                        $location.path("/" + attr.hpHref);
                    });
            }
        }
    }]);

Prøvde også å ha en kontroller som en del av direktivet. dvs.

angular.module("myApp")
    .directive('hpHref', function(){
        return {
            restrict : "A",
            scope: {},
            controller : ['$scope', '$location', function($scope, $location){
                $scope.goToUrl = function (url) {
                    // some more logic
                    console.log("Code reaches here");
                    $location.path(url);
                };
            }],
            link : function(scope, el, attr) {
                    el.bind('click', function(){
                        scope.goToUrl(attr.hpHref); 
                    });
            }
        }
    });

Dette fungerer heller ikke. Hva er problemet? Og hvordan kan $location brukes innenfor direktiver?

Svar #1

Så, i henhold til kommentaren ovenfor, hver gang du kaller Angular utenfor Angulars egne hendelsesbehandlere (ng-click osv.), må du kalle $scope.$apply(). JQuery-hendelser er det mest vanlige tilfellet der folk glemmer å kalle $apply().