AngularJS指令可以为给你的访问者提供更好的用户体验，比如通过展示用户头像来使页面看起来更具个性化。在你的注册表单中，可以在电子邮箱地址一栏的旁边展示一个头像，指示用户输入的是否是一个正确的邮件地址。如果在你的表单中有可选输入项，你可以默认隐藏它们，当用户点击时再展示出来，并且立刻自动将焦点对准第一个输入框。这些方法非常容易实现，并且可以通过指令来获得复用。

你有许多方式来构建AngularJS指令。关于如果创建用户指令已经有非常多的教程和指导（所以我不打算在此描述一些基本的东西）：

我这里选取了三条对于提升用户体验非常有帮助的指令，并且我很早就将其应用在产品中。

为了在你的应用中展示头像图片，你需要使用用户的电子邮件地址，将地址转换为小写并使用md5加密该字符串。所以聪明的做法是使用指令来做到这些，并且可以复用。

这其实是一个非常简短的指令，但是非常棒。在下面的例子中，用户点击了一个链接，显示的输入框需要能够自动获得焦点。这样，用户在页面显示时不必再手动点击文本域。

我们使用contenteditable而不是textarea元素的最主要原因在于使用前者可以在布局和UI中没有限制。我们在编辑器中使用这条指令可以实现将contenteditable元素的html和ng-model进行一个双向绑定。目前，在contenteditable元素中并没有支持ng-model。

结论：AngularJS指令可用于改善用户体验

我希望经过文中的介绍，你会感悟到AngularJS指令的有用之处。

对我而言，指令是AngularJS中最激动人心的特性。创建可重用的组件，并可以将其添加到纯粹的HTML应用程序库，这是多么难以置信并且强大的功能。由于指令实用，并且大部分指令书写难度不高，许多开发者早已对于目前受欢迎的库开发了许多指令。举例来说，AngularJS团队已经为Bootstrap创建了一系列的指令（难道还有人不用它吗？），被称作UI Bootstrap。

带你走近AngularJS系列：