CODEWITHSUNDEEP
javascripthtmlangularjs
Walter Wu
Walter Wu

Reputation: 43

My custom directive is not working

Here is my code: I expect it to generate a div with a <textarea> or an <ul> following the scope.current.type from DB and set the scope.current.content in them.

But it doesn't work , on my page just simply show <contentDirective></contentDirective> 

 app.directive("contentDirective", function($compile) {
    return {
        restrict: 'E',
        replace: true,
        template: "<div class='new__content__input new__content__input-text'></div>",
        link: function(scope, element, attrs) {
            if (scope.current.type === 'Text') {
                var DOM = "<textarea>" + scope.current.content + "</textarea>";
                element.append(node);
            } else if (scope.current.type === 'Quote') {
                var DOM = "<textarea>" + scope.current.content + "</textarea>";
                element.append(node);

            } else if (scope.current.type === 'List') {

                var ul = "<ul>";
                for (var i = 0; i < scope.current.content.length; i++) {
                    ul += "<li>" + scope.current.content[i] + "</li>";
                }
                ul += "</ul>";
                element.append(ul);
            }
        }
    };
});

And my html :

<li ng-repeat="doc in who_u_r" ng-init=" current = doc " class="new__content__input__single clearfix">
    <contentDirective></contentDirective>
<li>

Thank you very much for helping

Upvotes: 1

Views: 44

Answers (1)

byteC0de
byteC0de

Reputation: 5273

Change to This, Angular converts camelCasing to snake-casing,In this case, the name must be written using dashes and each dash represents a capital letter from the directive definition.

<content-directive></content-directive>

Upvotes: 1

Related Questions