初识AngularJS 结构
AngularJS
AngularJS 是比较新的技术,版本 1.0 是在 2012 年发布的。
AngularJS 是由 Google 的员工 Miško Hevery 从 2009 年开始着手开发。
这是一个非常好的构想,该项目目前已由 Google 正式支持,有一个全职的开发团队继续开发和维护这个库。
AngularJS 核心的概念:
Modules(模块)
模块定义了一个应用程序。
模块是应用程序中不同部分的容器。
模块是应用控制器的容器。
控制器通常属于一个模块。
一般用angular.module 函数来创建模块
使用模块带来的好处:1、保持全局命名空间的清洁;2、易于在不同的应用间复用代码;3、使应用能够以任意顺序加载代码的各个部分。
Components(组件)
一个组件包含一个视图即我们用来展示信息或者完成用户交互的页面。
技术上来讲, 一个组件就是一个控制模板视图的类, 在开发应用中会写很多组件。
组件中还可以包含多个子组件
Dependency Injection(依赖注入)
依赖注入是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入到一个独立的对象(或客户端)中,然后成为了该客户端状态的一部分。
该模式分离了客户端依赖本身行为的创建,这使得程序设计变得松耦合,并遵循了依赖反转和单一职责原则。
以下五个部件可用于依赖注入
Value | 用于向控制器传递值 |
factory | 一个函数用于返回值,通常用来计算或返回值 |
Provider | 创建一个 service、factory, Provider 中还提供了一个 factory 方法 get(),它用于返回 value/service/factory |
constant | 用来在配置阶段传递数值,注意这个常量在配置阶段是不可用的 |
service |
Services(服务)
在 AngularJS 中,服务是一个函数或对象
你可以创建自己的服务,也可以使用内建服务
AngularJS 内建了30 多个服务
常用服务
$location 服务 | 用于 返回当前页面的 URL 地址 |
$http 服务 | 向服务器发送请求,应用响应服务器传送过来的数据 |
$timeout 服务 | 延迟指定的时间后,执行相关的代码 |
$interval 服务 | 每经过指定时间段后,执行一次相关的代码 |
$watch服务 | 持续监听数据上的变化 |
我们可以创建自定义服务,链接到需要服务的模块中
链接需要在定义控制器的时候独立添加,设置依赖关系
连接以后,我们可以在控制器,指令,过滤器或其他服务中使用它
Data Binding(数据绑定)
在传统的web框架中,控制器将多个模型中的数据和模板组合在一起形成视图,并将其提供给用户
如果没有进行数据绑定的话,视图会暴露出一些不该被显示的数据
例如,将表达式把数据绑定到 HTML
AngularJS 将在表达式书写的位置"输出"数据(即表达式计算出的结果)
Directive(指令)
指令本质上就是 AngularJS 扩展具有自定义功能的HTML元素的途径,是一个封装的组件
通过在html标签中设置属性来传入参数,不需要去修改 JS 代码
如同函数一样,可以在任何地方调用,并且设置不同的属性(参数)来实现不同的功能
共同学习,写下你的评论
评论加载中...
作者其他优质文章