showdownjs/ng-showdown

Angular integration for Showdown

ng-showdown's Issues

Add `angular-sanitize` as a bower dependecy

We use angular-sanitize in the src, so it should be a dependency in the bower.json.

Sanitize option not in docs

Hello,

I am not sure if this is a ng-showdown issue or Showdown issue but how to enable sanitization is missing from the docs. I had to look at multiple issues and the code itself to realise this.

Here is the option: $showdownProvider.setOption('sanitize', true)

Browserify cannot find module 'showdown'

The error is simply:

15 10 2015 18:18:10.760:ERROR [framework.browserify]: bundle error
15 10 2015 18:18:10.760:ERROR [framework.browserify]: Error: Cannot find module 'showdown' from '../project/bower_components/ng-showdown/dist'

These are my installed packages

$ bower list
├─┬ ng-showdown#1.0.1
│ ├── angular#1.4.7 (1.5.0-build.4324+sha.469b14a available)
│ ├─┬ angular-sanitize#1.4.7 (1.5.0-build.4324+sha.469b14a available)
│ │ └── angular#1.4.7
│ └── showdown#1.2.3

A similar error was reported and fixed in showdown.

I'm running browserify in the Karma pipeline

paths = { test: [
  //..
  './bower_components/ng-showdown/dist/ng-showdown.js',
  //..
]}; 

config.set({
    basePath: __dirname + '/../..',
    files: paths.test,
    exclude: [],
    frameworks: ['browserify', 'jasmine'],
    browsers: ['PhantomJS'],
    reporters: ['progress', 'coverage'],
    preprocessors: {
        'bower_components/**/*js': ['browserify'],
        'app/src/app.js': ['browserify', 'coverage'],
        'app/src/**/*test.js': ['browserify', 'coverage']
    },
    coverageReporter: {
        type: 'html',
        dir: paths.dest.testCoverage
    },
    browserify: {
        debug: true,
        transform: ['babelify']
    },
    colors: true,
    logLevel: config.LOG_DEBUG,
    autoWatch: true,
    port: 9876,
    singleRun: false
});

any ideas? Thanks!

Angular 2 future?

Are there any plans to upgrade this tool for angular 2? Or is ng1 the final version?

I'm simply working on planning my upgrade strategy, and trying to discern both feasibility and timeline. showdownjs, and more specifically, ng-showdown, is an extremely integral part of my project, if not one of the most important parts of it.

If there are no plans to do it, are you open to accepting community contributions that get it ported to ng2? If you're not planning to do it, I may try to take the task upon myself.

Live Preview with iframe

iframes are inserted correctly, but when using it for a live preview, it reloads every time the input changes and makes the iframe disappear/reappear with every new character.

Documentation

Hello,
Are there plans to write a documentation any soon?

Addin setFlavor function

Add in set flavor function into the $showdownProvider. This would be a new option.

Strikethrough does not work in code blocks

Strikethroughs in code blocks formatted with strikethrough (rather than displaying bare symbols).

Example:

Code	Expected	Actual	Comment
~~text~~	text	text	Good so far
`~~text~~`	~~text~~	text	Strikethrough should not display
`**text**`	**text**	**text**	For example, bold works as expected

Publish release 1.1.0 to NPM

Although the package.json has been updated, this release hasn't been published via NPM.

unclear on using extensions with ng-showdown

I'm trying to add extensions to showdown, and am using ng-showdown to render markdown on my page. I'm a bit unclear about how this works; Assuming I've created and registered the extension...

$showdown.setOption('extension', ('myext', () => {
            return {
                type: 'lang',
                regex: /markdown/g,
                replace: 'showdown'
            };
        }));

How can I use this on my page without calling it directly? I'm rendering using the markdown-to-html directive.

I've browsed through the documentation several times and am just not understanding this. I basically want to add some custom tags, and from what I gather that should be easy with the extensions system.

unable to add ng-showdown in Electron app

I am trying to build a cross-platform app using electron js. In the app I am not able to integrate ng-showdown

Angular Support

I noticed the 1.0.0-beta branch removes the angular support for showdown in the core module. I'm in agreeance with splitting out this into its own repo.

I can build this functionality out. Here's my plan:

1. Rename this repo (or create a new one) called ngShowdown
2. Pull in the functionality that was in pre 1.0.0
3. Add readme details
4. Add an example
5. Publish to bower as 'ngShowdown'

@tivie What do you think of the name? (do you care?) Does this sound like a good plan?

Populate dist/ files or point package.json main at src/

Currently require('ng-showdown') doesn't work because it'll load ./dist/ng-showdown.js which is empty.
Can this either be pointed at the src file or the dist file get populated with a real build?

Some options not setting correctly

I have some options set with $showdownProvider.setOption('<property>', true);. Some of them work, some act as though the option is not being set. (Have not tested extensively, so these are only the options I'm using).

Broken

Option: setOption('underline', true);

Markdown

__text__

Expected
Underlined "text" (does not display in GitHub)

Actual
"text"

---

Option: setOption('simpleLineBreaks', true);

Markdown

text
text

Expected
"text
text"

Actual
"text text"

Working

(For sanity check purposes)

Option: setOption('tables', true);

Markdown

| Header1 | Header2 |
|:-------:|:-------:|
| itemA1  | itemA2  |
| itemB1  | itemB2  |

Result

Header1	Header2
itemA1	itemA2
itemB1	itemB2

---

Option: setOption('headerLevelStart', 2);

Markdown

# I'm a heading

Result (html)

<h2>I'm a heading</h2>

Directive broken when using jQuery (instead of jqLite)

This is related to #14 and #17 , just adding it here so it doesn't get lost. See my comment on #17:

Ok, found the core issue why the code doesn't work for me: I am using full jQuery and not only the JQlite bundled with angular. In it seems element.html behave a bit differently there, which results in jQuery not outputting anything.

That means passing the result of $sce.trustAsHtml() to element.html() works with jqLite (the jQuery like implementation bundled with angular), but not with the full jQuery.

@SyntaxRules mentioned a fix he had in mind:

I want to add in one more fix for line 174. It will include passing the output straight to a directive, instead of using angular.element. Which will fix the problem @phw was having. I'm hoping to have it done tuesday.

Directive seems to be broken

I think there is some conflict with the directives.

The current documentation says one should use

<p markdown-to-html="mdScopeVariable"></p>

For me this fails, having a look at the code the model value in https://github.com/showdownjs/ng-showdown/blob/master/src/ng-showdown.js#L121 is always undefined.

Looks like the model is expected in sd-model-to-html. However that doesn't work, either. Using both makes Angular complain about two directives requesting an isolated scope, using only sd-model-to-html strangely also shows an undefined model.

Using angular 1.3.15

[$injector:modulerr] when including ng-showdown as module dependency

var app = angular.module('myAngularApp', ['ngRoute', 'ngAnimate', 'ui.bootstrap', 'ng-showdown']);

When I use that line, I get an uncaught error. Everything works fine if you remove the ng-showdown from the list (except showdown does not work).
I use the following list of other javascript files/libraries:

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular-route.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular-animate.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap-tpls.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.3.0/showdown.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ng-showdown/1.1.0/ng-showdown.min.js"></script>

Tests are failing in Travis CI

https://travis-ci.org/showdownjs/ng-showdown

How to compile an extension's result?

I was able to make a custom extension, but I couldn't find how to compile the contained directives.
The given tag is replaced, but the resulting HTML is not processed by Angular.

How to compile the result with Angular? I don't know if it is even possible to define a compilation from .config(). Should the extension be included somewhere else?

Here is a test extension replacing &test by '<simple-element></simple-element>:

angular.module('myApp')
.config(['$showdownProvider', function($showdownProvider) {
    myExt =  function () {
        return [{
            type: 'output',
            filter: function (text) {
                var regex = /(<p>&amp;test<\/p>)+/g;
                text = text.replace(
                    regex,
                    '<simple-element>extension: ok, directive: NOT</simple-element>'
                );
                return text;
            }
        }];
    };

    $showdownProvider.loadExtension(myExt);   
}]);

The simpleElement directive:

angular.module('myApp')
.directive('simpleElement', [function() {
    return {
        restrict: 'E',
        replace: true,
        template: '<div>Everything works!</div>'
    }
}]);