Angularjs ng html绑定和语法突出显示

Angularjs ng html绑定和语法突出显示,angularjs,Angularjs,我有一个使用ng html bind加载html内容的元素: <p ng-bind-html="content.body"></p> 在此内容中,我有一个或多个块。 我只想将语法高亮显示应用于加载内容的代码标记,例如使用angular highlightjs指令 有没有办法做到这一点?有很多方法可以将页面上的html绑定到Angular。一种方法是使用ngbindhtml,但它并不是这个用例的最佳选择,因为编译时还需要angular highlightjs指令。使用

我有一个使用
ng html bind
加载html内容的元素:

<p ng-bind-html="content.body"></p>

在此内容中,我有一个或多个
块。 我只想将语法高亮显示应用于加载内容的代码标记,例如使用angular highlightjs指令


有没有办法做到这一点?

有很多方法可以将页面上的html绑定到Angular。一种方法是使用
ngbindhtml
,但它并不是这个用例的最佳选择,因为编译时还需要
angular highlightjs
指令。使用$compile可以实现以下目标:

/** Here, you will need to do some transformations to your html string
 *  1. Add `hljs` attribute or `class="hljs"` to the `<code>` tag in any `<pre><code>`
 *  2. Hopefully you already have your line breaks in place. This will result in 
 *     a single line code block otherwise. See my plunk for how I added '\n'
 */
var myHTML = $scope.content.body;
element.append( $compile( myHTML )($scope) );

你试过使用角度强光吗?@佳健:是的。如果我简单地添加
hljs
属性,则没有效果;如果我将
ng bind html
替换为
hljs source
则会突出显示所有内容。问题是,我有混合content@Mat,是否可以将
hljs
属性添加到传入字符串中的代码块中?另外,请注意,说明您需要
tags@JulianSoro:正如我在问题中所写,我在HTML内容中有代码标记。正在添加hljs属性。。。我可以尝试用字符串替换内容的代码标签,看看会发生什么……正如您在plunk中看到的那样,空白非常重要。每个
\n
和空格都会对结果的外观产生影响。更新plunk几次后,您可以单击版本或使用它。使用$compile应该会更快,对吗?在这种情况下,技术上我不需要绑定,因为Angular必须在HTML中实例化指令并创建新的作用域,所以ng bind HTML会更快。但是,问题首先在于。。。