Ace编辑器

• Ace编辑器是一个嵌入web的代码编辑器，支持语法高亮，自动补全等功能，如果想在页面展示或编辑代码，使用该工具是很合适的。

• 参考项目地址：

  结合AngularJs1使用

• 目前已经有结合使用的项目了：
• 我仅做展示使用，所以参考该项目，写一个简单使用例子：

1. 嵌入web的指令

app.directive('uiAce',[function () {    return {        restrict : 'EA',        require: '?ngModel',        link: function ($scope,$element,$attributes,ngModel) {            if (angular.isUndefined(window.ace)) {                throw new Error('ui-ace need ace to work...');            }            var acee = window.ace.edit($element[0]);            var session = acee.getSession();            if(ngModel){                ngModel.$formatters.push(function (value) {                    if(angular.isUndefined(value) || value ==null){                        return '';                    }else {                        return value;                    }                });                ngModel.$render = function () {                    var text = JSON.stringify(ngModel.$viewValue, null, '\t');                    session.setValue(text);                };            }        }    }}]);

1. 页面使用

• 这里ng-model绑定的变量，只要变化，上面指令里会重新渲染编辑器的内容，实现代码展示的功能。

1. 使用时加入ace的库，加入相关内容，即可。