How to generate url encoded anchor links with AngularJS?

by

You can use the native encodeURIComponent in javascript.
Also, you can make it into a string filter to utilize it.

Here is the example of making escape filter.

js:

var app = angular.module('app', []);
app.filter('escape', function() {
  return window.encodeURIComponent;
});

html:

<a ng-href="#/search?query={{address | escape}}">

(updated: adapting to Karlies’ answer which uses ng-href instead of plain href)

More Related Contents:

  1. The Advantages when we put AngularJS within Symfony web application
  2. AngularJS: Service vs provider vs factory
  3. Why does AngularJS include an empty option in select?
  4. AngularJS access parent scope from child controller
  5. How to Display blob (.pdf) in an AngularJS app
  6. How to execute AngularJS controller function on page load?
  7. AngularJS: How to make angular load script inside ng-include?
  8. Injecting $scope into an angular service function()
  9. Is there a way to make AngularJS load partials in the beginning and not at when needed?
  10. Angular $scope.$apply vs $timeout as a safe $apply
  11. How do I fix the npm UNMET PEER DEPENDENCY warning?
  12. Preserve line breaks in angularjs
  13. angular js unknown provider
  14. AngularJS error .success is not a function
  15. Directive isolate scope with ng-repeat scope in AngularJS
  16. calling method of parent controller from a directive in AngularJS
  17. Angular $location.path not working
  18. $apply already in progress error
  19. Clear History and Reload Page on Login/Logout Using Ionic Framework
  20. What is `priority` of ng-repeat directive can you change it?
  21. Track to see when a view changes in angularjs
  22. AngularJS check if form is valid in controller
  23. Multiple Module in Angularjs
  24. Angular ng-click event delegation
  25. Dynamic content added with AngularJS click event not working on the added content
  26. Ui-Router $state.go inside $on(‘$stateChangeStart’) is cauzing an infinite loop
  27. AngularJS Service Passing Data Between Controllers
  28. AngularJS: Uncaught Error: [$injector:modulerr] Failed to instantiate module?
  29. AngularJS – Directives vs Controllers
  30. What is $$phase in AngularJS?

Leave a Comment