Description

[thenanox]

Im trying to make directives to work in new docular version but im not able to make description to appear into a directive I created:

This is the documentation:

/**
 * @ngdoc directive
 * @name mpGraph
 * @description
 * This component draws a basic graph.
 * Json example:
 * ```json
 * {
 * "data": [
 *     [0,3],
 *     [4,8],
 *     [8,5],
 *     [9,13]
 * ]
 * }
 * 
 * @param {string} mpGraph receive a JSON containing an array with the data in the graph. Each subrray defines the X and Y coordinates of a point.
 */

I checked the template that draws the description and its implemented with the directive:

<ng-example-container group='group' example="docDescription"></ng-example-container>

Im checking the behaviour of this directive and it seems that needs to have a ng-example or example tag into description in order to generate the description:

     .directive('ngExampleContainer', ['$compile', 'ngmarkdown', function ($compile, markdownService) {
        return {
            scope: {
                example: '=example',
                group: '='
            },
            restrict: 'E',
            link: function ($scope, $element) {
                var template = $scope.example, example, files = [], i = 0;
                if (!template) {
                    return;
                }

                if(!$scope.examples) {
                    $scope.examples = [];
                }

                example = template.match(/(<ng-example[^>]*>[\s\S]+?(?=<\/ng-example>)<\/ng-example>)/g);

                var tempTemplate = markdownService(template.replace(/(<ng-example[^>]*>[\s\S]+?(?=<\/ng-example>)<\/ng-example>)/g, function () {
                    return '\n%%NGTOKEN' + (i++) + '%%\n'
                }));

                i = 0;
                template = tempTemplate.replace(/(<p>%%NGTOKEN[0-9]+%%<\/p>)/g, function () {
                    var index = i++;
                    var exampleItem = example[index];
                    exampleItem = exampleItem.replace('<ng-example', '<ng-example example="examples[' + index + ']"')
                    return exampleItem;
                });

                i = 0;
                template = template.replace(/(<file[^>]*>[\s\S]+?(?=<\/file>)<\/file>)/g, function (content) {
                    files.push(content);
                    return '<div class="NGFILE" id="NGFILE' + (i++) + '"></div>'
                });

                if (example) {
                    example.forEach(function (example) {

                        var exampleEl = $(example);
                        var ex = {
                            deps: exampleEl.attr('deps'),
                            group: $scope.group,
                            module: exampleEl.attr('module'),
                            files: []
                        }

                        var files = example.match(/(<file[^>]*>[\s\S]+?(?=<\/file>)<\/file>)/g);

                        for (var i = 0, l = files.length; i < l; i++) {
                            var fileContent = files[i].match(/<file[^>]*>([\s\S]+)<\/file>/);

                            var child = $(files[i]);
                            var name = child.attr('name');
                            var split = name.split('.');

                            ex.files.push({
                                name: name,
                                content: fileContent[1],
                                type: split[split.length - 1]
                            });

                        }

                        $scope.examples.push(ex);
                    });

                    var compiled = $compile(template)($scope.$new());
                    compiled.each(function () {
                        if ($(this).is('.NGFILE')) {
                            var id = $(this).attr('id');
                            var index = parseInt(id.replace('NGFILE', ''), 10);
                            $(this).replaceWith($(files[index]));
                        }
                    });

                    $element.append(compiled);
                }
            }
        };
    }])

My question is, im i doing something wrong or this is not the right behaviour?

UPDATE:
I thought about the code, and maybe the last part of it should be out of if(example) ? This code block should be in every case?

                    var compiled = $compile(template)($scope.$new());
                    compiled.each(function () {
                        if ($(this).is('.NGFILE')) {
                            var id = $(this).attr('id');
                            var index = parseInt(id.replace('NGFILE', ''), 10);
                            $(this).replaceWith($(files[index]));
                        }
                    });

                    $element.append(compiled);

If i change that, it works, but im still not sure if this was a mistake or im doing it wrong.

Pull request #4

[stephenliberty]

I'll look at your suggested fix, but one thing bugs me about your example. You have a start ''' json, but not an end ''' (pardon the conversion from backtick to apostrophe - markdown is trying to autoformat it for me).

[thenanox]

Mmm you are right. In my source file its ok:

 * @description
 * This component draws a basic graph.
 * Json example:
 * ```json
 * {
 * "data": [
 *     [0,3],
 *     [4,8],
 *     [8,5],
 *     [9,13]
 * ]
 * }
 * ```

I think because its also markdown syntax, something went wrong when copying