今天做了的事：学习service，在textarea里添加富文本编辑器，为input添加表单验证 
明天要做的事：完成立即上线和存为草稿，有余力的话从二级联动，下线，编辑，删除里面挑两个完成 
今天遇到的问题： 
1.UEditor（下文简称UE）的使用：

富文本编辑器的选择

首先我们综合考量了一下各个富文本编辑器，后来在知乎看见了如此回答。

所以我慨然决定使用百度的UEditor（手动滑稽）。

准备

首先我们下载一个UEditor，发现官网上有好几个版本，ASP，JSP百度一下发现是前后端分离和不分离的区别，并没过多了解，选择了分离的ASP。 
使用UE需要引入必不可少的三个文件： 

<link rel="stylesheet" href="../plugins/utf8-asp/themes/default/css/ueditor.min.css">

<script src="../plugins/utf8-asp/ueditor.config.js"></script>

<script src="../plugins/utf8-asp/ueditor.all.js"></script>

且文件引入config一定要在all之前引入。

引入和创建实例

首先我们在想要引入UE的地方定义一个id，此处推荐textarea标签。然后我们要将这个UE 实例化，此处为实例代码： 

<script type="text/javascript">
    var ue = UE.getEditor('art-explain');
    UE.getEditor("art-explain").ready(function() {
        this.setContent('请在此处写下说明...');
    });
</script>

初始化操作

UE有自带方法toobars，可以在其中定义想要初始化的属性。 
或者直接修改config文件，不推荐此方法

实例创建后直接执行接口报错

按照UE的自带方法，一定是这么写： 

<script type="text/javascript">
    var ue = UE.getEditor('art-explain');
    ue.setContent('请在此处写下说明...');
</script>

那么为甚么会出问题呢？ 
官网api文档给出答案： 
其实出现这种问题，其实是大家不了解UEditor的创建原理导致的。因为UEditor的编辑区域使用iframe作为编辑容器。所以当编辑器创建实例后，先会创建一个iframe元素，然后在iframe元素中写入一些脚本，这些脚本会在iframe元素初始化完成时被调用。

脚本的作用主要是为编辑器实例赋值iframe中的body,window,document对象的引用。 看到这里，大家就应该明白UEditor的初始化过程其实是个异步过程。

因为是个异步过程。所以场景中的书写方式就会出现问题了。虽然工厂方法getEditor能正确返回编辑器实例，但同步的代码ue.setContent马上就被执行了，因为setContent是在编辑容器中写内容，这时需要用到body,document等元素，但这些元素的引用赋值却在异步中才做的赋值。所以才会出现直接执行setContent时会出现无效的问题。当然有时不同浏览器的效果会出现不同。一些高级的浏览器比如chrome有时是可以的，但大部分ie浏览器都不行。这主要是因为浏览器的性能所致的。 那正确的方式是什么呢？

UEditor为开发者提供了ready接口，他会在编辑器所有的初始化操作都结束时调用。保证你要做的操作能在一个完整的初始化环境中执行。

所以正确的实例化如上。

获取不到offset width的错误

当我在总的app.js中对UE实例化的时候，浏览器抛出“获取不到offset width”的错误。百度上说此错误是因为实例化的过程中DOM没有出现，所以取不到宽度。解决办法是吧script文件写在UE引入的标签的紧下方。

后台配置项返回格式出错，上传功能将不能正常使用！

此错误可以不用解决，但是并未检测，故写定。

2.表单验证 
Angular表单验证提供了很多表单验证指令，并且能将html5表单验证功能同他自己的验证指令结合起来使用。 
要使用表单验证，首先保证表单有一个name属性，一般的输入字段如最大，最小长度等，这些功能由html5表单属性提供，如果我们想屏蔽浏览器对表单的默认验证行为，可以在表单元素上添加novalidate标记。 
所以input要放入form里。 

下面介绍一些常用验证方法：

1. 必填项验证 
   某个表单输入是否已填写，只要在输入字段元素上添加HTML5标记required即可：

<input type="text" required />

1. 最小长度 
   验证表单输入的文本长度是否大于某个最小值，在输入字段上使用指令ng-minleng= “{number}”：

2. <input type="text" ng-minlength="5" />

3. 最大长度 
   验证表单输入的文本长度是否小于或等于某个最大值，在输入字段上使用指令ng-maxlength=”{number}”：

4. <input type="text" ng-maxlength="20" />

5. 模式匹配 
   使用ng-pattern=”/PATTERN/”来确保输入能够匹配指定的正则表达式：

6. <input type="text" ng-pattern="/[a-zA-Z]/" />

7. 电子邮件 
   验证输入内容是否是电子邮件，只要像下面这样将input的类型设置为email即可：

8. <input type="email" name="email" ng-model="user.email" />

9. 数字 
   验证输入内容是否是数字，将input的类型设置为number：

10. <input type="number" name="age" ng-model="user.age" />

11. URL 
    验证输入内容是否是URL，将input的类型设置为 url：

12. <input type="url" name="homepage" ng-model="user.facebook_url" />

感悟：泣血蝇虫笑苍天，孤帆叠影锁白链