AngularJS从文本创建html / link / anchor（视图中的escape / unescape html） [英] AngularJS create html/link/anchor from text (escape/unescape html in view)

问题描述

我有一个具有指定值的控制器：

I have a controller that has an assigned value:

$scope.post = 'please visit http://stackoverflow.com quickly';

我的html中有一些文字：

I have some text in my html:

<p>{{post}}</p>

我想创建一个url的可点击链接（用锚标签包围它）。

I would like to make a clickable link of the url (surround it with anchor tags).

我试图将我的html更改为：

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? ?

推荐答案

我认为你可以使用Angular的linky过滤器：https://docs.angularjs.org/api/ngSanitize/filter/linky

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

您可以像这样使用它：

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

您必须包含Angular的清理模块才能使用linky：

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

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

这篇关于AngularJS从文本创建html / link / anchor（视图中的escape / unescape html）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！