如何在angular js中从github获取原始自述文件后将其转换为html格式的文档

how to convert a raw readme file to html formated document after geting it from github in angular js

本文关键字：转换 html 文档 格式 自述文件 angular js 中从 原始 获取 github      更新时间：2024-04-12

我使用了以下控制器，但如何将README.MD原始文件的每一行格式化为html文档

    angular.module('ExampleApp', [])
  .controller('ExampleController', function($scope, Slim,$sce) {
    Slim.getReadme().then(function(resp) {
      $scope.readme = $sce.trustAsHtml(resp.data);
    }).catch(function(resp) {
      console.log("catch", resp);
    });
  })
  .service('Slim', function($http) {
    return {
      getReadme: function() {
        return $http.get("https://api.github.com/repos/btford/angular-markdown-directive/readme", {
          headers: {
            "Accept": "application/vnd.github.v3.raw"
          }
        });
      }
    };
  });

我很高兴知道将原始自述文件转换为格式化的html页面

如何将README.MD原始文件的每一行格式化为html文档。。

您从github API得到的响应是简单的降价。所以你只需要：

  • 在实际将response.data绑定到作用域之前，使用适当的markdown到html库来渲染它。下面是一个使用marked.js 的例子

     $scope.readme = $sce.trustAsHtml($scope.parseMD(resp.data));

    其中parseMD是一个返回渲染的HTML 的函数

     $scope.parseMD = function(md_content){
      return marked(md_content);
 }

  • 使用ng-bind-html 将输出绑定为html

     <div ng-bind-html="readme"></div>

你在parseMD做什么真的取决于你，这只是一个选择的问题。以下是一些流行的HTML库降价：

  • 标记//易于理解/深入了解代码
  • markdown js//支持maruku和gruber方言
  • showdown.js//在stackexchange中分叉为PageDown

所有这些库似乎都与Github Flavored Markdown 配合得很好

这是演示

有一些插件可以将markdown编译为html。其中之一是由evidstreak:制作的markdown.js

https://github.com/evilstreak/markdown-js

我建议您查看showdownjs，获取原始文本并将其转换为类似的html。

var converter = new showdown.Converter(),
    text      = '#hello, markdown!',
    html      = converter.makeHtml(text);
相关文章：