为了账号安全,请及时绑定邮箱和手机立即绑定

初识AngularJS 结构

标签:
JavaScript

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

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

原文出处

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消