Angular 系列文章目录

Photo by Birmingham Museums Trust on Unsplash

Angular 系列文章是我在 Angular 使用过程中对 Angular 中概念、基本用法的一些理解与总结。这里的文章都是我实验论证反复修改的结果,若有转载烦请标明出处。

目录

一、模块

一个 Angular 应用是如何组织的。我在Angular 模块漫谈做了详细解答。

二、组件

组件数据传递

若把传入组件的方向定义为数据的入方向,那么传出组件的方向就可以称为数据的出方向。我在 数据传递的“出”方向 —— @Input数据传递的“入”方向@Output 中介绍了 Angular 中最基本最常用的组件间传递数据的方法。

自定义双向绑定

Angular 中只要按照指定语法定义输入与输出属性就能实现双向绑定。我在这里介绍了这种定义的方法。

组件视图传递

Angular 组件投影。它和 @Input @Output 的差别在于,前者解决了组件之间视图传递的问题,而后者解决了组件中变量的传递问题。本文阐述了这种差别,并介绍了投影的用法。

组件元素操纵

@ViewChild/@ContentChild 是Angular 中获取元素引用的两种方式。在此文中我特别地对其中的static 和 read 选项做了解读。

三、路由

路由快速教程。快速复习路由的知识点以及一些细节。

路由匹配教程。路由匹配的两种方法 prefix 与 full 以及一些细节。

Angular Resolver 教程。Resolver 负责业务数据的抓取,在组件渲染之前拿

到数据。

四、指令

Angular 指令快速入门。什么是 Angular 指令,如何设计指令。我在这篇文章中做了解答。

Angular NgIf 指令原理。内建指令中,NgIf 算是比较简单的一种。理解它,可以掌握构造指令的基本方式。

Angular 指令之 NgFor 教程。NgFor 是相对复杂一点的 Angular 指令。这篇文章中我主要介绍了一下 NgFor 的基本用法以及 trackBy 函数的使用。

五、依赖注入

Angular 中 forRoot 方法与依赖注入息息相关。在 Angular forRoot 详解 中我详细分析了 forRoot 要解决的问题。

六、视图

Angular 中 View 的那些事儿。视图是什么,MVVM 是什么?Angular 如何把视图组织起来形成应用,我在这篇文章里做了解答。

七、变更检测

Zone.js 入门。 Zone.js 是 Angular 变更检测的基础。这篇文章中我用几个小例子说明了如何使用 Zone.js 。

Zone.js 源码初探。在了解 Zone.js 的基本使用之后,我从源码的角度分析了它的工作原理,想要了解更多一些的朋友可以看我这篇文章。

浅谈 Angular 变化检测机制。变化检测(Change Detection)也叫脏值检测(Dirty Detection),都是指 Angular 检测组件中数据变化的机制。由于变化检测与 Angular 若干生命周期有很强的关联,本文结合两者做出说明。

源码角度理解 Angular 变更检测。Angular 变更检测如何实现,这篇文章应该对你有所启发。

Angular 变更检测策略 OnPush。本文中我讨论里 Angular OnPush 组件执行变更检测的两个基本条件。

八、高级应用

Angular 动态创建嵌入式视图。 Angular 下如何使用 TS 代码动态生成一个页面片段,这篇文章解释了这个问题。

Angular 动态创建与操纵组件。 Angular 除了可以动态创建嵌入式视图 ,亦可利用现有的组件类动态在组件中创建一个组件。这种方法常用在弹出层、对话框等场景下。总体来说动态创建组件应用场合较为狭窄,只有在静态组件无法处理的场景下,才需要考虑到动态创建组件的可能性。

九、项目实践

Angular 项目框架更新。 Angular 作为一个版本变化比较快的框架,其所应用的项目保持相应的更新是非常重要的一个任务。新的版本往往带来了新的功能,修补了一些漏洞,官方文档也建议及时对 Angular 项目进行更新。