Angularjs编写KindEditor,UEidtor指令

　　目前angularJS非常火热，本人也在项目中逐渐使用该技术，在angularJS中，指令可以说是当中非常重要的一部分，这里分享一些自己编写的指令：

　　注：本人项目中用了oclazyload进行部分JS文件加载

　　1、KindEditor

angular.module('AdminApp').directive('uiKindeditor', ['uiLoad', function (uiLoad) {    return {        restrict: 'EA',        require: '?ngModel',        link: function (scope, element, attrs, ctrl) {            uiLoad.load('../Areas/AdminManage/Content/Vendor/jquery/kindeditor/kindeditor-all.js').then(function () {                var _initContent, editor;                var fexUE = {                    initEditor: function () {                        editor = KindEditor.create(element[0], {                            width: '100%',                            height: '400px',                            resizeType: 1,                            uploadJson: '/Upload/Upload_Ajax.ashx',                            formatUploadUrl: false,                            allowFileManager: true,                            afterChange: function () {                                ctrl.$setViewValue(this.html());                            }                        });                    },                    setContent: function (content) {                        if (editor) {                            editor.html(content);                        }                    }                }                if (!ctrl) {                    return;                }                _initContent = ctrl.$viewValue;                ctrl.$render = function () {                    _initContent = ctrl.$isEmpty(ctrl.$viewValue) ? '' : ctrl.$viewValue;                    fexUE.setContent(_initContent);                };                fexUE.initEditor();            });        }    }}]);

　　2、UEditor:

angular.module("AdminApp").directive('uiUeditor', ["uiLoad", "$compile", function (uiLoad, $compile) {    return {        restrict: 'EA',        require: '?ngModel',        link: function (scope, element, attrs, ctrl) {            uiLoad.load(['../Areas/AdminManage/Content/Vendor/jquery/ueditor/ueditor.config.js',                   '../Areas/AdminManage/Content/Vendor/jquery/ueditor/ueditor.all.js']).then(function () {                       var _self = this,                            _initContent,                            editor,                            editorReady = false                       var fexUE = {                           initEditor: function () {                               var _self = this;                               if (typeof UE != 'undefined') {                                   editor = new UE.ui.Editor({                                       initialContent: _initContent,                                       autoHeightEnabled: false,                                       autoFloatEnabled: false                                   });                                   editor.render(element[0]);                                   editor.ready(function () {                                       editorReady = true;                                       _self.setContent(_initContent);                                       editor.addListener('contentChange', function () {                                           scope.$apply(function () {                                               ctrl.$setViewValue(editor.getContent());                                           });                                       });                                   });                               }                           },                           setContent: function (content) {                               if (editor && editorReady) {                                   editor.setContent(content);                               }                           }                       };                       if (!ctrl) {                           return;                       }                       _initContent = ctrl.$viewValue;                       ctrl.$render = function () {                           _initContent = ctrl.$isEmpty(ctrl.$viewValue) ? '' : ctrl.$viewValue;                           fexUE.setContent(_initContent);                       };                       fexUE.initEditor();                   });        }    };}]);

　　3、jquery.Datatable：

angular.module('AdminApp').directive('uiDatatable', ['uiLoad', '$compile', function (uiLoad, $compile) {    return function ($scope, $element, attrs) {        $scope.getChooseData = function () {            var listID = "";            var chooseData = $element.find("input[name = IsChoose]:checkbox:checked");            if (chooseData.length > 0) {                for (var i = 0; i < chooseData.length; i++) {                    listID += chooseData[i].value + ",";                }            }            return listID.substring(0, listID.length - 1);        }        $scope.refreshTable = function () {            $scope.dataTable.fnClearTable(0); //清空数据            $scope.dataTable.fnDraw(); //重新加载数据        }        uiLoad.load(['../Areas/AdminManage/Content/Vendor/jquery/datatables/jquery.dataTables.min.js',                '../Areas/AdminManage/Content/Vendor/jquery/datatables/dataTables.bootstrap.js',                '../Areas/AdminManage/Content/Vendor/jquery/datatables/dataTables.bootstrap.CSS']).then(function () {                    var options = {};                    if ($scope.dtOptions) {                        angular.extend(options, $scope.dtOptions);                    }                    options["PRocessing"] = false;                    options["info"] = false;                    options["serverSide"] = true;                    options["language"] = {                        "processing": '正在加载...',                        "lengthMenu": "每页显示 _MENU_ 条记录数",                        "zeroRecords": '<div style="text-align:center;font-size:12px">没有找到相关数据</div>',                        "info": "当前显示第 _PAGE_ 页 共 _PAGES_ 页",                        "infoEmpty": "空",                        "infoFiltered": "搜索到 _MAX_ 条记录",                        "search": "搜索",                        "paginate": {                            "first": "首页",                            "previous": "上一页",                            "next": "下一页",                            "last": "末页"                        }                    }                    options["fnRowCallback"] = function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {                        $compile(nRow)($scope);                    }                    $scope.dataTable = $element.dataTable(options);                });        $element.find("thead th").each(function () {            $(this).on("click", "input:checkbox", function () {                var that = this;                $(this).closest('table').find('tr > td:first-child input:checkbox').each(function () {                    this.checked = that.checked;                    $(this).closest('tr').toggleClass('selected');                });            });        })    }}]);