angular中ueditor插件的使用

#在angularjs中使用ueditor编辑器需要注意事项：

在ui-view中使用放置ueditor的div，页面加载时编辑器在页面中是不显示的，需要通过指令手动replay

例：

 /**
     * ueditor使用指令手动replay
 */
mainModule.directive('editor', function($http) {
    return {
        restrict: 'A'
        , scope: {
            content: '='
        }
        , link: function(scope, element, attrs){

          var editor = new UE.ui.Editor({initialContent: scope.content});
          editor.render(element[0]);
         var token = sessionStorage.getItem('token');
         console.log(token);
          editor.ready(function(){
//                editor.addListener('contentChange', function(){
//                  scope.content = editor.getContent();
//                  scope.$root.$$phase || scope.$apply();
//                });

//                scope.$watch('content', function(newValue){
//                  editor.setContent(newValue);
//                });
          });
            $('#btn1').click(function(){
 /**通过getcontent方法获取文本内容时需要对文本中的双引号进行转义，同时通过scope绑定从数据库查询的文本时需要通过$sce服务，使ng-bind-html不会过滤掉文本自带的样式
 //$scope.text = "<p style=\"text-align: center;\">ssssssss</p>
 //$scope.texts = $sce.trustAsHtml($scope.text);*/
                var content = editor.getContent().replace(/"/gm,'\\"');
                console.log(content);
                 //获得发布的图片地址
                var imageUrls = $("#filepic2").data('fileinput').getUploadSucFile();
                var imgUrl = JSON.stringify(imageUrls);
                //创建对象拼接字符串参数
                var obj = {};
                obj.title = $('#title').val();
                obj.content = content;
                obj.summary = $('#summary').val();
                obj.cover = imgUrl;
                //data对象json化
                var data = JSON.stringify(obj);
                console.log(data);
                $http({
                    method : 'post',
                    url : 'article/create',
                    data:data,
                    headers : {
                                                    'token' :token
                                                }
                })
                .success(
                        function(resp) {
                            alert('保存成功')
                        });
            })

        }
    };
})
 

html中使用

 <div class="inp-elem">
    <div editor style="min-height: 200px; width: 100%;" 
                content="content" style="margin-top:200px"></div>
</div> 

查看更多关于angular中ueditor插件的使用的详细内容...