currently I'm handling links this way:
<a ng-click="goToLink('/foo')">foo</a>
$scope.goToLink = function(url) {
$location.path(url)
}
because if I do
<a ng-href="/foo">foo</a>
the page is of course reloaded(and getting 404), because it should be something like:
<a ng-href="#/foo">foo</a>
Is there a directive or something to define links that are 'html5 mode agnostic', so that I don't have to put the hashtag in every link?
Something like
<a ng-smart-href="/foo">foo</a>.
The ng-href directive overrides the original href attribute of an <a> element. The ng-href directive should be used instead of href if you have AngularJS code inside the href value. The ng-href directive makes sure the link is not broken even if the user clicks the link before AngularJS has evaluated the code.
The angular component decorator provides a property called templateUrl and using this property you can set the external HTML file path. By default, angular creates an HTML file with the name app. component. html within the app folder when you create a new angular project.
link function is basically used to manipulate the DOM( Document Object Model ) element using custom directive. link option in custom directive registers DOM listener and also update the DOM.
Check ng-href, It is exactly what you are looking for. http://docs.angularjs.org/api/ng.directive:ngHref
Check "Relative links" example from http://docs.angularjs.org/guide/dev_guide.services.$location
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