Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

$location.path not working inside an Angular directive

I'm trying to update $location.path from within an AngularJS directive. It's not working as I expect, which is to update the URL displayed in the browser window and show different contents on my page. My functions are definitely getting called with the correct values, as seen in the console. I think $location.path might be having some effect, because when I click the link, some additional functions get called that would be called on the new page, only the new page is never displayed. When I use $location.path within a controller, it works as expected, but not in my directive.

Here's the HTML for my directive:

<div detail-link="/comments?post={{post.postId}}" ng-click="clickDetailLink()"></div>

Here's the directive's definition (in CoffeeScript):

directives.directive 'detailLink', ['$location', ($location) ->
    return (scope, element, attrs) ->
        scope.clickDetailLink = ->
            console.log "loading " + scope.detailLinkHref
            $location.path scope.detailLinkHref

        attrs.$observe 'detailLink', (value) ->
            console.log "set detail link to " + value
            scope.detailLinkHref = value
]

I have a clue what's going on here... my $routeProvider is set up to handle /comments but here I'm trying to append a query string to the route. If I use a regular <a href="#/comments?post={{post.postId}}">, that works fine, but somehow setting the same route via $location.path is not working. This is irrespective of whether this code is in the controller or directive.

like image 559
jab Avatar asked Jun 18 '13 19:06

jab


1 Answers

Try scope.$apply? (notice the $)

like image 146
Brian Lewis Avatar answered Sep 29 '22 11:09

Brian Lewis