Angularjs编写KindEditor,UEidtor,jQuery指令

　　目前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');
                });
            });
        })
    }
}]);

以上3则就是本人编写的angularjs指令，这里抛砖引玉下，希望对小伙伴们能有所帮助，