初识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 代码

如同函数一样,可以在任何地方调用,并且设置不同的属性(参数)来实现不同的功能


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值