天天看点

ABP-百度ueditor富文本编辑器使用(一)

1.下载ueditor富文本编辑器http://ueditor.baidu.com/website/download.html#ueditor

2.选择适合自己的版本,将下载下来的文件包直接放至libs文件夹下

3.导入config.js  和  all.config中

建议在Web-App-Common-Views-Layout-Layout.cshtml中引入

<script type="text/javascript" src="~/libs/ueditor/ueditor.config.js"></script>
	<script type="text/javascript" src="~/libs/ueditor/ueditor.all.js"></script>
           

这样可以在发布时有效避免因路径产生的问题。

4.在使用的页面时候调用

4.1html中使用

<script id="editor" name="content" type="text/plain" >
								
</script>
           

4.2js中使用

初始化编辑器

   ue = UE.getEditor('editor');
                    ue.ready(function () {
                        ue.setContent(vm.news.context);
         })
           

获得编辑器内容

vm.news.context = UE.getEditor('editor').getContent();
           

销毁编辑器,这个很重要,在离开当前页面的时候销毁掉编辑器,如果不销毁此编辑器就会导致第二次打开时,编辑器消失。

$scope.$on("$destroy", function () {
				console.log("我离开了,不要想我")
				ue.destroy();
			})
           

最后别忘了  ue一定是一个公共变量。