CODEWITHSUNDEEP
javascripthtmlangularjsgithub-api
Achuth hadnoor
Achuth hadnoor

Reputation: 342

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

I used the following controller but how to format each line of the README.MD raw file to html document

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

I would be excited to know transformation of raw readme file to a formatted html page

Upvotes: 1

Views: 1253

Answers (3)

nalinc
nalinc

Reputation: 7425

..how to format each line of the README.MD raw file to html document..

Response you are getting from github API is plain markdown. So you just need to:

  • render the response.data using a suitable markdown-to-html library before you actually bind it to scope. Here's an example using marked.js 

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

    Where parseMD is a function that returns rendered HTML 

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

  • bind the output as html using ng-bind-html

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

What you do in parseMD is really upto you, its just a matter of choice. Here are some popular markdown-to-HTML libraries:

  • marked // Easy to understand/dive into the code
  • markdown-js // supports maruku as-well-as gruber dialect
  • showdown.js // forked as PageDown in stackexchange

All these libraries seem to go well with Github Flavored Markdown

Here's the DEMO

Upvotes: 1

kockburn
kockburn

Reputation: 17636

I suggest you look into showdownjs, take raw text and convert it to html like so.

var converter = new showdown.Converter(),
    text      = '#hello, markdown!',
    html      = converter.makeHtml(text);

Upvotes: 1

Pasukaru
Pasukaru

Reputation: 1105

There are plugins that compile markdown to html. One of those is markdown.js by evilstreak:

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

Upvotes: 1

Related Questions