AngularJs定制样式插入到ueditor中的问题小结

, allowDivTransToP: false 

function insertHtml() {
var value = prompt('插入html代码', '');
UE.getEditor('editor').execCommand('insertHtml', value)
} 

<script src="libs/ueditor/ueditor.config.js"></script>
<script src="libs/ueditor/ueditor.all.min.js"></script>

// 创建编辑器的实列
$scope.ready = function (ueditor) {
window.editor = ueditor;
}; 

<!-- 添加工具栏 -->
<div class="set-toolbar">
<h4 class="text-center">工具栏</h4>
<!-- sidebar content -->
<div class="sidebar-menu">
<a ng-click="toggle('titleStyle')" class="nav-header menu-first " ><span class="glyphicon glyphicon-pencil"></span>首页</a>
<ul ng-hide="titleStyle" id="userMeun" class="nav nav-list menu-second">
<li ng-repeat="title in sources.titles" ng-click="insertHtml('titles', title)"><a>{{title.name}}</a></li>
</ul>
<a ng-click="toggle('titleIcon')" class="nav-header menu-first"><span class="glyphicon glyphicon-picture"></span>图标</a>
<ul ng-hide="titleIcon" id="articleMenu" class="nav nav-list menu-second">
<li class="set-image" ng-repeat="img in sources.imgs" ng-click="insertHtml('imgs', img)"><a><img ng-src="{{img.url}}"></a></li>
</ul>
<a ng-click="toggle('titleYouxia')" class="nav-header menu-first "><span class="glyphicon glyphicon-user">生活</span></a>
<ul ng-hide="titleYouxia" id="glyphicnMenu" class="nav nav-list menu-second">
<li ng-repeat="yx in sources.yxs" ng-click="insertHtml('yxs', yx)"><a>{{yx.name}}</a></li>
</ul>
<a ng-click="toggle('titleServe')" class="nav-header menu-first "><span class="glyphicon glyphicon-briefcase"></span>留言板</a>
<ul ng-hide="titleServe" id="serveMenu" class="nav nav-list menu-second">
<li ng-repeat="ser in sources.sers" ng-click="insertHtml('sers', ser)"><a>{{ser.name}}</a></li>
</ul>
<a ng-click="toggle('titleArticle')" class="nav-header menu-first "><span class="glyphicon glyphicon-thumbs-up"></span>推荐文章</a>
<ul ng-hide="titleArticle" id="ArticleMenu" class="nav nav-list menu-second">
<li ng-repeat="arc in sources.arcs" ng-click="insertHtml('arcs', arc)"><a>{{arc.article}}</a></li>
</ul>
</div>
<!-- 内容主题结束 -->
</div> 

// 工具栏交互样式
$scope.titleStyle = $scope.titleIcon = $scope.titleYouxia = $scope.titleServe = $titleArticle=false;
$scope.toggle = function(style){
$scope[style] =! $scope[style];
}

$scope.insertHtml = function (type, item) {
if (type === 'titles' || type === 'imgs') {
editor.execCommand('insertHtml', item.html);
}

angular.module('service')
.service('ArticleService', function ($http) {
return {searchArticle: function(title){ return $http.get('api/article/search',{ data: { title:title } }); } }; });

angular.module('article.controllers')
.controller('serviceCtrl', function ($scope, $rootScope, $filter, $timeout, $state, $stateParams, ContentService,, ArticleService, type) {

var arcfullSearch={
text: '',
result: [],
selected: [], //选择后的数据先存入数组
beginSearch: function () {
var self = this;
var text = self.text.trim();
if(!text) return;
ArticleService.searchArticle(text).then(
function (data){ 
//获取得到数据 第二个data表示获取数组里的内容，第一个是传进来的参数 
self.result = data.data;//获取数据
}, function (err) {
console.log(err);
}); 
},
};

var arr = serve.map(function (xx) {
return item.html.replace(/{{([\w\.]+?)}}/gi, function (match, p) {
var index = p.indexOf('.'); 
if (index > 0) {
return formatField(xx[p.slice(0, index)][p.slice(index+1)]);
} else {
return formatField(xx[p]);
}
}); 
});