1.安裝ueditor

去angular庫中下載：

npm install ueditor --save

去ueditor下載相關依賴點選開啟連結

我下載的是jsp1.4.3 utf-8版本。

拷貝至專案的目錄下

2.在html中加入js

<script src="ueditor/ueditor.config.js"></script>
<script src="ueditor/ueditor.all.js"></script>
<script src="../../lib/js/angular-ueditor/dist/angular-ueditor.min.js"></script>
<script src="ueditor/lang/zh-cn/zh-cn.js"></script>
 

如果不加zh-cn.js會包缺少語言包的錯

嵌入ng.ueditor

 var adminHome = angular.module('adminHome', [
        'ng.ueditor'
    ]);

插入ueditor外掛

<div class="form-group">
                <label class="control-label col-sm-2">內容<span class="red">*</span></label>
                <div class="col-sm-10">
                    <textarea id="container" name="content" type="text/plain">
                    </textarea>
                </div>
            </div>
 

3.controller

首先配置一個自定義的工具欄的ueditor

//解決載入一次之後，第二次不能初始化的問題
            UE.delEditor('container');
            var ue = UE.getEditor('container',{
                initialFrameWidth :'100%',//設定編輯器寬度
                initialFrameHeight:'40%',//設定編輯器高度
                scaleEnabled:true,
                //配置工具欄
                toolbars:[
                    ['fullscreen', 'source', 'undo', 'redo', 'bold']
                ],
                autoHeightEnabled: true
            })
 

init();

        function init(){
            //編輯器建立成功後，才可以使用setContent()給編輯器設定內容
            ue.addListener("ready",function () {
                ue.setContent("<p>hellop</p>");
            })
        }

獲取編輯器的內容(是帶格式的html)

 var temp = ue.getContent();