0

我正在开发一个博客应用程序。我想创建包含 HTML 和代码片段的帖子(存储在数据库中的数据)我想创建 github gists 并使用它们提供的嵌入式脚本标签在您的网站上显示 gist。那就是我遇到问题的地方。我可以使用 ng-bind-html 让 HTML 显示得很好,但该绑定似乎正在剥离脚本标记。我找到了这篇文章:插入 HTML 和应该运行的脚本。我在 Angular 之前加载 jQuery,但它似乎没有帮助。此外,我使用的是 v1.2,它不再具有 ng-bind-html-unsafe,这就是我使用 ng-bind-html 的原因,它可以完美地工作,只是它会去除脚本标签。

也许这完全是个坏主意。有没有更好的方法来完成我想要的?

4

2 回答 2

0

我决定注意文档中的警告,而不是执行来自我的数据库的脚本。相反,我找到了 GitHub gists 的替代方案:http: //alexgorbatchev.com/SyntaxHighlighter

现在我仍然可以在我的博客条目中使用 HTML 并ng-bind-html对其进行清理,并且我可以在我的布局中嵌入语法荧光笔脚本。我只需要创建一个指令来调用它:

布局

<article ng-repeat="blog in blogs" repeat-done="layoutDone()">
  <h4 class="title-bg">{{blog.title}}</h4>
  <div class="post-summary">
    <p ng-bind-html="blog.body"></p>
  </div><!-- /post-summary -->
</article>

指示

angular.module('socketwizApp')
 .directive('repeatDone', function ($parse) {
   return {
     restrict: 'A',
     link: function (scope, element, attrs) {
       if (scope.$last) {
         var fn = $parse(attrs.repeatDone);
         fn(scope);
       };
     }
   };
 });

控制器

$scope.layoutDone = function() {
     $timeout(function(){
       SyntaxHighlighter.defaults.toolbar = false;
       SyntaxHighlighter.highlight();
     }, 0);
 };
于 2013-09-13T04:26:34.990 回答
0

使用$sce。特别是 $sce.JS。或者您可以降级 angular 但 sce 是一种新方法。

于 2013-09-11T11:43:01.820 回答