如何在一个角度js web应用程序中使用ckeditor？ [英] how to use ckeditor in an angular js web App?

问题描述

我在 angularjs 内建立的html页面中努力使用 ckeditor 。

我尝试了很多例子。

  ng-ckeditor指令
 ckeditor指令
  

但这些例子都没有帮助我。

我想要一个textarea，我可以在其中输入图像并编辑它的内容样式（就像在 ckeditor 中）。

任何人都请给我一个清晰的例子或演示如何在 angularjs 中使用 ckeditor 。

我也尝试过自定义指令。这是行不通的。

ck编辑器是否有其他选择？

感谢您的提前。

解决方案

https：/ /github.com/lemonde/angular-ckeditor 。步骤1-3在README.md中实际记录得相当好，其余的很容易开发......

1. 获取角度-ckeditor：git clone -depth = 50
   https://github.com/lemonde/angular -batitor


2. 通过$ b $下载资源bower：bower安装angular-ckeditor


3. 编写自己的控制器
   （请参阅README.md中的示例）
   

4. 将您的js文件链接到您的html中，并保留
   的订单跟踪：

   
   
   
   
   
   
   
   
   

按照描述，在你的html中使用你的控制器和指令。如果你想用HTML中的数据预编译你的编辑器，你可以使用类似这样的内容：

  data-ng -init =content ='这是一个带有< a href =& quot; http：//localhost/whatever.html& quot; target =& quot; _blank& quot;& gt;的文本嵌入式链接< / a& gt;'contenteditable =trueready =onReady（）> 
  

或者你在控制器中初始化模型变量（硬编码或者通过$ http） / p>

我从如何在角JS应用程序中使用ckeditor？。它为我工作。

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.

解决方案

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.

这篇关于如何在一个角度js web应用程序中使用ckeditor？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！