《AngularJS深度剖析与最佳实践》一2.1 什么是UI-阿里云开发者社区

开发者社区> 华章出版社> 正文
登录阅读全文

《AngularJS深度剖析与最佳实践》一2.1 什么是UI

简介:

本节书摘来自华章出版社《AngularJS深度剖析与最佳实践》一书中的第2章,第2.1节,作者 雪狼 破狼 彭洪伟,更多章节内容可以访问云栖社区“华章计算机”公众号查看

2.1 什么是UI

提起UI,你一定知道它是指用户界面(User Interface),但是如果细细剖析,你会发现它没那么简单。
对于一个用户界面,它实际上包括三个主要部分:
内容:你想展现哪些信息?包括动态信息和静态信息。注意,这里的内容不包括它的格式,比如生日,跟它显示为红色还是绿色无关,跟它显示为年月日还是显示为生辰八字也无关。
外观:这些信息要展示为什么样子?这包括格式和样式。样式还包括静态样式和动画效果等。
交互:用户点击了加入购物车按钮时会发生什么?还要更新哪些显示?
在前端技术栈中,这三个部分分别由三项技术来负责:HTML负责描述内容,CSS负责描述外观,JavaScript负责实现交互。当然,这三者之间没有明确的界限,比如有些格式化需要JavaScript来实现,而HTML也往往会影响一些样式。
如果进一步抽象,它们分别对应MVC的三个主要部分:内容—Model,外观—View,交互—Controller。
对应到Angular中的概念,“静态内容”对应模板,“动态内容”对应Scope,交互对应Controller,外观部分略微复杂点:CSS决定样式,过滤器(filter)则决定格式。
有了这些概念为基础,我们再来深入讲解下Angular中的概念。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享: