Question

情况：

我有一个小的angularjs应用程序，可以让我保存一篇“文章”，然后显示它。一篇文章将包含纯文本以及html，js，css或php代码的示例。使用带有MySQL的Laravel 4后端，我可以保存它没问题。当我试图展示文章时，麻烦来了。我希望突出显示代码语法，因此我使用了角度突出显示插件。这使事情变得有点棘手，但实际上，我将指令“hljs”放在代码片段周围。然后我在容器标记周围放置一个指令，文章将在$watch进行更改，$compile结果。这似乎工作正常，因为语法突出显示开始。我的问题是角度仍然对我的代码做了一些事情。它需要<?php并将其更改为<!--?。它需要<并将其更改为<。但它只留下像<p>这样的html标签。这有点令人气愤。

html：

<div dynamic ng-bind-html="article.body"></div>

指令：

.directive('dynamic', function ($compile, $parse) {
    return {
        restrict: 'A',
        replace: true,
        link: function (scope, ele, attrs) {
            var parsed = $parse(attrs.ngBindHtml);
            function getStringValue() { return (parsed(scope) || '').toString(); }

            scope.$watch(function(scope) {
                return (parsed(scope) || '').toString(); 
            }, function(html) {
                $compile(ele, null, -9999)(scope);
            });
        }
    };
})

我做了什么：

我已停用$sce。在你告诉我这是一个坏主意之前，我并不担心恶意代码。此应用程序将仅由四个人使用，它位于我的网络内部，无法从外部访问。我禁用了$sce，因为我认为这就是改变我的代码所以我不必为trustAsHtml()而烦恼。我认为问题可能是highlightjs，但当我删除它时，问题仍然存在。我会对数据库中的内容以及通过$http.get请求的内容进行双重和三重检查。

我尝试使用javascript的.replace()函数更改article.body，但由于angular是$watch - ing，代码只是在我替换之后重新编译，然后又回到了混乱状态。

修改

article.body可能包含以下内容：

<p>Here is an example in PHP:</p>

<div hljs>
    <?php
        echo "Hello, world!";
    ?>
</div>

AngularJS编码尖括号

0 个答案: