how to use ckeditor in an angular js web App?

Question

I am struggling to use ckeditor within my html page built in angularjs.

I have tried so many examples.

ng-ckeditor directive
ckeditor directive

But none of those examples helped me.

I want a textarea where I can input images within it and edit its contents style (Like in ckeditor).

Anyone please give me a clear example or demo fiddle on how to use ckeditor in angularjs.

I have also tried custom directive. It's not working.

Is there any alternative for ck editor?

Thanks in advance.

Answer 1

https://github.com/lemonde/angular-ckeditor. Step 1-3 are actually documented quite well in the README.md and the rest is pretty easy to develop...

1. get the angular-ckeditor: git clone -depth=50 https://github.com/lemonde/angular-ckeditor
2. download resoureces via bower: bower install angular-ckeditor
3. Write yourself a controller (see example in the README.md)

4. link your js files in your html, keep track of the order:

use your controller and the directive inside your html as described. If you would like to pre-initialize your editor with data from your html, you could use something like this:

data-ng-init="content='this is a text with <a href="http://localhost/whatever.html" target="_blank">an embedded Link</a>'" contenteditable="true" ready="onReady()">

or you init your model variable(s) in your controller (hardcoded or via $http).

I have got this from How to use ckeditor in angular JS app?. and its worked for me.