官方文档是这么说的:

You write Angular applications by:

composing HTML templates with Angularized markup,

writing component classes to manage those templates,

adding application logic in services,

and boxing components and services in modules.

用modules发布打包component和service

用component类管理templates

模块

每个 Angular 应用至少有一个模块(根模块),习惯上命名为AppModule

根模块在一些小型应用中可能是唯一的模块,大多数应用会有很多特性模块,每个模块都是一个内聚的代码块专注于某个应用领域、工作流或紧密相关的功能。

模块库

组件

组件负责控制屏幕上的一小块区域,我们称之为视图view

模板

我们通过组件的自带的模板来定义组件视图。模板以 HTML 形式存在,告诉 Angular 如何渲染组件。

数据绑定

<li>{{hero.name}}</li>
<app-hero-detail [hero]="selectedHero"></app-hero-detail> <li (click)="selectHero(hero)"></li>
  • {{hero.name}}插值表达式<li>标签中显示组件的hero.name属性的值。

  • [hero]属性绑定把父组件HeroListComponentselectedHero的值传到子组件HeroDetailComponenthero属性中。

  • (click) 事件绑定在用户点击英雄的名字时调用组件的selectHero方法。

双向数据绑定是重要的第四种绑定形式,它使用ngModel指令组合了属性绑定和事件绑定的功能。 下面是HeroDetailComponent模板的范例:

<input [(ngModel)]="hero.name">

在双向绑定中,数据属性值通过属性绑定从组件流到输入框。用户的修改通过事件绑定流回组件,把属性值设置为最新的值。

Angular 在每个 JavaScript 事件循环中处理所有的数据绑定,它会从组件树的根部开始,递归处理全部子组件。

指令 (directive)

当 Angular 渲染它们时,它会根据指令提供的操作对 DOM 进行转换。

组件是一个带模板的指令@Component装饰器实际上就是一个@Directive装饰器,只是扩展了一些面向模板的特性。

服务

服务是一个广义范畴,包括:值、函数,或应用所需的特性。几乎任何东西都可以是一个服务。 典型的服务是一个类,具有专注的、明确的用途。它应该做一件特定的事情,并把它做好。

  • 日志服务

  • 数据服务

  • 消息总线

  • 税款计算器

  • 应用程序配置

服务没有什么特别属于 Angular 的特性。 Angular 对于服务也没有什么定义。 它甚至都没有定义服务的基类也没有地方注册一个服务

即便如此,服务仍然是任何 Angular 应用的基础。组件就是最大的服务消费者。

服务无处不在。

组件类应保持精简。组件本身不从服务器获得数据、不进行验证输入,也不直接往控制台写日志。 它们把这些任务委托给服务。

组件的任务就是提供用户体验,仅此而已。它介于视图(由模板渲染)和应用逻辑(通常包括模型的某些概念)之间。 设计良好的组件为数据绑定提供属性和方法,把其它琐事都委托给服务。

依赖注入Dependency injection

“依赖注入”是提供类的新实例的一种方式,还负责处理好类所需的全部依赖。大多数依赖都是服务。 Angular 使用依赖注入来提供新组件以及组件所需的服务。

先用注入器(injector)为HeroService注册一个提供商(provider)。 提供商用来创建或返回服务,通常就是这个服务类本身(相当于new HeroService())。

可以在模块中或组件中注册提供商。

通常会把提供商添加到根模块上,以便在任何地方都使用服务的同一个实例。

也可以在@Component元数据中的providers属性中把它注册在组件层:

把它注册在组件级表示该组件的每一个新实例都会有一个服务的新实例

需要记住的关于依赖注入的要点是:

  • 依赖注入渗透在整个 Angular 框架中,被到处使用。

  • 注入器 (injector) 是本机制的核心。

    • 注入器负责维护一个容器,用于存放它创建过的服务实例。

    • 注入器能使用提供商创建一个新的服务实例。

  • 提供商是一个用于创建服务的配方。

  • 提供商注册到注入器。

转载于:https://www.cnblogs.com/xuanmanstein/p/7749975.html

ng的概念层次(官方文档摘录)相关推荐

  1. ClickHouse 官方文档摘录

    数据库创建: 延时引擎: 1 CREATE DATABASE testlazy ENGINE = Lazy(expiration_time_in_seconds); mysql引擎: 1 CREATE ...

  2. Cocos Creator 加载和切换场景(官方文档摘录)

    在 Cocos Creator 中,我们使用场景文件名( 可以不包含扩展名)来索引指代场景.并通过以下接口进行加载和切换操作: cc.director.loadScene('MyScene'); 通过 ...

  3. Hyperledger Fabric 2.0 官方文档中文版 第3章 关键概念

    Hyperledger Fabric 2.0 官方文档中文版 第3章 关键概念 总目录 3.关键概念 引言 什么是区块链? 区块链为什么有用? 什么是Hyperledger Fabric? Hyper ...

  4. oracle12c官方文档中文版_三分钟让你真正读懂oracle12c 中cdb pdb概念及原理

    Oracle 12C引入了CDB与PDB的新特性,在ORACLE 12C数据库引入的多租用户环境(Multitenant Environment)中,允许一个数据库容器(CDB)承载多个可插拔数据库( ...

  5. 【官方文档】Fluent Bit 概念

    文章目录 1. 关键概念 1.1. 事件或记录(Event or Record) 1.2. 过滤(Filtering) 1.3. 标签(Tag) 1.4. 时间戳(Timestamp) 1.5. 匹配 ...

  6. 【kubernetes/k8s概念】Kubernetes1.12从零开始(初):课程介绍与官方文档汇总

    说明 资料和交流方式 Kubernetes的文档介绍 Kubernetes中的术语与资源的操作方法 Kubernetes的API约定与启用方法 Kubernetes中资源(Object)的定义 kub ...

  7. 官方文档太辣鸡?TensorFlow 2.0开源工具书,30天「无痛」上手

    本文转载自机器之心. 项目作者:lyhue1991 「官方文档排布凌乱.搜索难用.API 丑陋不堪--」这是很多人对 TensorFlow 官方文档的吐槽.但吐槽归吐槽,到了工业界,你是无论如何也绕不 ...

  8. AsyncDisplayKit官方文档个人翻译

    迁移老文章到掘金 文档比较老了,不适用最新的2.0 AsyncDisplayKit 官方文档 最近在拆解学习AsyncDisplayKit这个很知名的轮子,发现这个轮子内容还是非常庞大的,想要分解学习 ...

  9. Spring Framework 官方文档学习(四)之Validation、Data Binding、Type Conversion(二)

    接前一篇 Spring Framework 官方文档学习(四)之Validation.Data Binding.Type Conversion(一) 本篇主要内容:Spring Type Conver ...

最新文章

  1. 新手UI设计师需要掌握的知识和技能
  2. python函数结构_Python函数基础
  3. anaconda怎么运行python程序-致Python初学者 Anaconda入门使用指南完整版
  4. Mysql(12)——inner join的用法
  5. 20、mysql中触发器的使用
  6. 学习easyui疑问(三)
  7. Apache下的配置文件httpd.conf、httpd-vhosts.conf 转
  8. JSK-12 最后一个单词的长度【入门】
  9. fix ubuntu boot(grub)
  10. Atitit 索引法 html文件转txt纯文本索引 适用于 evernote索引,导入imap邮箱,方便检索 /sumdoclist/src/aPkg/html2txtIndexFile.jav
  11. 歌曲只需要伴奏,怎么消去歌声?
  12. 科技文献检索(十三)——特种文献的检索与利用
  13. 反射系数、驻波比、S参数之间的关系!
  14. html5个人记账网页源代码,蓝色的cms企业记账管理后台模板源码
  15. win10系统 开启蓝牙服务器,Win10打开蓝牙的方法步骤详解
  16. springboot社区快递代取服务系统毕业设计源码051434
  17. gnuplot画图技巧总结
  18. SpringMVC工作原理 侵立删
  19. 最优化方法:非线性方程的求极值方法
  20. 系统服务器Fedora和Red Hat Enterprise Linux实用指南(第6版)(上、下册)( 入行必读的Linux圣经)...

热门文章

  1. hdu 6351 Beautiful Now
  2. 单通道图像保存_3D图像展示篇结构更清晰
  3. OpenGL基础13:第一个正方体
  4. 牛客小白月赛8: E. 诡异数字(数位DP)
  5. 有向图生成树个数(bzoj 4894: 天赋)
  6. 图像 super-resolution restruction 的各种主流实现方式
  7. 杨辉三角形(简明易懂)
  8. python绘制心形图像
  9. python基本定制之__new__, __init__
  10. 记git升级版本之后出现fatal: NullReferenceException encountered问题