angular-marked

!NPM versionnpm-badgenpm !Downloadsdownload-badgenpm !Downloadsbower-badge !Build Statustravis-imagetravis-url !Codacy Badgecodacy-badgeCodacy !js-semistandard-stylestandard-badgesemistandard !Licenselicense-badgeMIT License AngularJS Markdown using marked. Please note: neither this directive nor marked (by default) implement sanitization. As always, sanitizing is necessary for user-generated content.

Install

bower install angular-marked or npm install angular-marked or jspm install angular-marked=npm:angular-marked Depending on your setup you may need include script tags in your html: ```html ```

Usage

```js var app = angular.module('example-app', 'hc.marked'); ```

Set default options (optional)

```js app.config('markedProvider', function (markedProvider) { markedProvider.setOptions({gfm: true}); }); ``` Example using highlight.js Javascript syntax highlighter (must include highlight.js script). ```js app.config('markedProvider', function (markedProvider) { markedProvider.setOptions({

gfm: true,

tables: true,

highlight: function (code, lang) {

if (lang) {

return hljs.highlight(lang, code, true).value;

} else {

return hljs.highlightAuto(code).value;

}

}

}); }); ```

Override Rendered Markdown Links

Example overriding the way custom markdown links are displayed to open in new windows: ```js app.config('markedProvider', function (markedProvider) { markedProvider.setRenderer({

link: function(href, title, text) {

return "<a href='" + href + "'" + (title ? " title='" + title + "'" : '') + " target='_blank'>" + text + "</a>";

}

}); }); ```

Use as a directive

```html # Markdown directive It works! ``` Bind the markdown input to a scope variable: ```html ``` Include a markdown file: ```html ``` Or a template (great for md that includes code blocks): ```html ``` Use ``compile`` attribute to support AngularJS directives inside markdown. ```html ``` ```javascript .controller('ClickHandler', function() { this.doClick = function() {

...

}; }) ```

As a service

```js app.controller('myCtrl', 'marked', function (marked) { $scope.html = marked('#TEST'); }); ```

Testing

Install npm and bower dependencies: ```sh npm install bower install npm test ```

Why?

I wanted to use marked instead of showdown as used in angular-markdown-directive as well as expose the option to globally set defaults. Yes, it is probably best to avoid creating a bunch of angular wrapper modules... but I use this enough across multiple projects to make it worth while for me. Use it if you like. Pull requests are welcome.

Acknowledgments

Based on angular-markdown-directive by briantford which, in turn, is based on this excellent tutorial by @johnlinquist.

License

Copyright (c) 2013-2015 Jayson Harshbarger MIT License