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.
Try scope.$apply? (notice the $)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With