如何执行从服务器检索脚本标签 [英] How to execute script tags retrieved from a server

问题描述

我的工作博客应用程序。我想创建的职位（存储在数据库中的数据），其中包含HTML和code段我想创建的github学家和使用嵌入式脚本标记它们为您的网站上显示的依据。多数民众赞成在那里我有问题。我可以得到HTML显示蛮好用NG绑定，HTML，但结合似乎被剥离出的脚本。我发现这个职位：<一href=\"http://stackoverflow.com/questions/13711735/angular-js-insert-html-with-scripts-that-should-run/14088380#14088380\">Angular JS：插入HTML与应运行脚本。我加载jQuery的前角，但它似乎并没有帮助。另外我使用的1.2版，它不再有NG-绑定-HTML不安全的，这就是为什么我使用NG绑定，HTML，它完美的作品，除了它去掉脚本标记。

I am working on a blog application. I would like to create posts (data stored in a database) that contains HTML and for code snippets I would like to create github gists and use the embedded script tag they provide for displaying a gist on your site. Thats where I'm having problems. I can get the HTML to display just fine using ng-bind-html, but that binding seems to be stripping out the script tag. I found this post: Angular JS: Insert HTML with scripts that should run. I am loading jQuery before Angular but it doesn't seem to help. Also I'm using v1.2 and it no longer has ng-bind-html-unsafe, which is why I'm using ng-bind-html, which works perfectly except that it strips script tags.

也许这仅仅是一个坏主意完全。有没有更好的方式来完成我想要什么？

Maybe this is just a bad idea altogether. Is there a better way to accomplish what I want?

推荐答案

我决定听从文档中的警告，而不是执行从我的数据库来的脚本。相反，我发现GitHub上学家一种替代方案： http://alexgorbatchev.com/SyntaxHighlighter

I decided to heed the warnings in the documentation and not execute a script that came from my database. Instead I found an alternative to GitHub gists: http://alexgorbatchev.com/SyntaxHighlighter

现在我仍然可以使用HTML在我的博客文章和 NG-绑定-HTML 将消毒吧，我可以在我的布局嵌入语法高亮显示脚本。我只需要创建一个指令来调用它：

Now I can still use HTML in my blog entry and ng-bind-html will sanitize it, and I can embed the syntax highlighter script in my layout. I just needed to create a directive to call it:

布局

<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);
 };

这篇关于如何执行从服务器检索脚本标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！