CODEWITHSUNDEEP
angularjsckeditorangularjs-ng-template
Vivien Touly
Vivien Touly

Reputation: 79

Use CKeditor in template with AngularJS

I have a problem to use CKeditor.

First in the top I have this :

<textarea class="ckeditor" id="test"></textarea>

No problem I have a textarea with the buttons style (bold,underline,...) of ckeditor.

But I have the same texterea in a template :

<script type="text/ng-template".....
.....
<textarea class="ckeditor" id="test"></textarea>
.....
.....</script>

And I have a simple textarea... Do you know this problem ?

Upvotes: 1

Views: 5653

Answers (1)

devqon
devqon

Reputation: 13997

You should use directives for this, because angular loads in templates asynchronously while the ckeditors are created (by jquery probably) when the document is loaded.

Either use an existing library, like https://github.com/lemonde/angular-ckeditor, or create a simple directive yourself:

angular.module("myApp", [])
    .directive("ckeditor", [function(){
        return {
            restrict: "A",
            link: function (scope, elem, attrs) {
                CKEDITOR.replace(elem[0], {
                    // configuration
                });
            }
        }
    }]);

html:

<textarea ckeditor></textarea>

Upvotes: 3

Related Questions