AngularJS create html/link/anchor from text (escape/unescape html in view)

anchor, angularjs, html-escape-characters, hyperlink, sanitize

Solution

I think you can use Angular's linky filter for this: https://docs.angularjs.org/api/ngSanitize/filter/linky

You can use it like so:

<p ng-bind-html="post | linky"></p>

You'll have to include Angular's sanitize module for linky to work:

angular.module('myApp', [
    'ngRoute',
    'ngSanitize',
    'myApp.filters', 
    ...

Problem

I have a controller that has an assigned value: ``` $scope.post = 'please visit http://stackoverflow.com quickly'; ``` I have some text in my html: ``` <p>{{post}}</p> ``` I would like to make a clickable link of the url (surround it with anchor tags). I tried to change my html to: ``` <p ng-bind-html="post | createAnchors"></p> ``` Here is a simplified example of the problem: http://jsfiddle.net/T3fFt/4/ The question is, how can I escape the whole post text, except for the link, which will be surrounded by anchor tags? ?

Original source