Angular 4.x 修仙之路
来源:互联网 发布:淘宝买家手机号码采集 编辑:程序博客网 时间:2024/06/10 03:36
转自:https://segmentfault.com/a/1190000008754631
Angular 4.x 快速入门
Angular 4 基础教程
涉及 Angular CLI 使用、创建组件、事件、自定义服务、 ngFor 指令、Input、Output 装饰器等
Angular 4 快速入门
涉及 Angular 简介、环境搭建、插件表达式、自定义组件、表单模块、Http 模块等
Angular 4 指令快速入门
涉及如何创建指令、定义输入属性、事件处理、如何获取宿主元素属性值、如何创建结构指令等
Angular 4 表单快速入门
涉及如何创建表单、表单验证、表单控件状态、单选控件、多选控件的使用等
Angular 表单简介
涉及 Template-driven 表单与 Reactive 表单的特点、表单控件状态、Reactive 表单简介等
Angular 4.x 路由快速入门
涉及路由简介、如何配置路由、动态路由、子路由、路由指令及路由相关 API 等
TypeScript 简介
涉及 TypeScript 数据类型、复合类型、箭头函数、可选参数、默认参数、对象解构、数组解构等
Angular 4.x 组件学习线路 (仅供参考)
对于刚从 Angular 1.x 转到 Angular 4.x 的用户,建议先阅读一下 Angular 4.x vs Angular 1.x
章节 (目前还不够完善)。下面提供的学习线路仅供参考,读者可以自行选读。该学习线路基本包含 Angular 4.x 组件相关知识,如果有遗漏,欢迎大家指出。(友情提示:初学者不用完整了解每个部分的内容,特别是设计源码分析的部分,只需了解基本用法,然后多实践哈)
Angular 4.x Template Syntax & Common Directives
了解 Angular 4.x 模板语法和常用内建指令(更新ngIf...Else)
Angular 4.x Directive
了解指令与组件的区别及Metadata信息
Angular 4.x Directive Lifecycle
了解常用的 ngOnInit、ngOnChanges、ngAfterViewInit、ngAfterContentInit 声明周期钩子和触发顺序
Angular 4.x constructor & ngOnInit
了解 constructor 与 ngOnInit 钩子的应用场景
Angular 4.x ViewEncapsulation
了解 ViewEncapsulation 三种封装模式的区别
Angular 4.x Input
了解 @Input() 装饰器的用法,掌握如何实现父 -> 子组件通信
Angular 4.x Output
了解 @Output() 装饰器的用法,掌握如何实现子 -> 父组件通信
Angular 4.x ViewChild & ViewChildren
了解 @ViewChild()、@ViewChildren() 装饰器用法,掌握如何获取子组件
Angular 4.x ContentChild & ContentChildren
了解 @ContentChild()、@ContentChildren() 装饰器用法及与@ViewChild()、@ViewChildren() 装饰器的区别
Angular 4.x HostListener & HostBinding
了解宿主元素的概念及 @HostListener()、@HostBinding() 装饰器的作用
Angular 4.x ElementRef
了解 ElementRef 的作用、定义及应用、Renderer API 常用方法
Angular 4.x TemplateRef & ViewContainerRef
了解 TemplateRef 及 ViewContainerRef 的应用
Angular 4.x Components Communicate
了解组件通信的常用方式
Angular 4.x Component Inheritance
了解面向对象中类和继承的概念及Angular 4.x 组件继承的应用
Angular 4.x Change Detection - 1、Angular 4.x Change Detection - 2
了解 Angular 4.x 变化检测、组件变化检测器及OnPush 策略、Mutable & Immutable、ChangeDetectorRef、Observables 等内容
Angular 4.x vs Angular 1.x
Angular 4.x NgModule vs Angular 1 module
涉及 Angular 1.x 根模块、子模块及 Angular 4.x 根模块、根组件、子组件的定义使用
Angular 4.x Service vs Angular 1 Service
涉及 Angular 4.x 和 Angular 1 如何定义 service及使用方式
Angular 4.x Pipe vs Angular 1 filter
涉及 Angular 自定义管道(过滤器)、管道(过滤器)传参、管道对象($filter) 服务的使用
Angular 4.x ngFor vs Angular 1 ng-repeat
涉及 Angular *ngFor(ng-repeat) 指令使用、index($index)、trackBy(track by ) 的应用的区别
Provider
Angular 4.x Provider
涉及 useClass、useValue、useExisting、useFactory 及 Provider 使用方式
Angular 4.x Multi Providers
涉及 multi provider 作用及 Angular 4.x 内部应用
Angular 4.x Forward Reference
涉及 forwardRef 的作用及内部工作原理,同时解释 JavaScript 解释器不能自动提升 Class
Angular 4.x OpaqueToken & InjectionToken
涉及使用字符串作为 Token存在问题,详细介绍如何使用 OpaqueToken、InjectionToken 解决问题
Directive(指令)
Angular 4.x Template Syntax & Common Directives
涉及模板语法、常用指令简介及 NgStyle 指令解析、*ngFor trackBy 应用等
Angular 4.x Directive
涉及指令分类、Angular 4.x 内置属性指令、结构指令、
*directive
结构指令语法糖、自定义属性指令、结构指令等
Angular 2.x 结构指令
涉及结构指令定义、
*
号语法及具体应用示例
Angular 4.x Directive Lifecycle
涉及指令与组件的区别、指令生命周期钩子的作用及调用顺序、生命周期钩子详解、Angular 4.x LifecycleHooks、SimpleChanges 相关接口等
Angular 4.x NgIf
涉及 NgIf 指令作用、语法、基础用法及 NgIf 指令源码分析
Angular 4.x NgForOf
涉及 NgForOf 指令作用、语法、基础用法及 NgForOf 指令源码分析
Angular 4.x NgTemplateOutlet
涉及 NgTemplateOutlet 指令作用、语法、基础用法及 NgTemplateOutlet 指令源码分析
Angular 4.x Components Communicate
涉及组件通信的常用方式:@Input、@Output、@ViewChild、模板变量、MessageService、Broadcaster (Angular 1.x $rootScope 中 $on、$broadcast ) 和 Pub - Sub 模式、RxJS Subject 存在的问题
Angular 4.x Pass Async Data
涉及父子组件通信时,处理异步输入属性的方案
Angular 4.x Component Inheritance
涉及面向对象中类和继承的概念及Angular 4.x 组件继承的应用及注意事项
Angular 4.x Dynamically Creating Components
涉及 Angular 中如何动态创建组件及介绍
<ng-container>
指令的作用
Decorator(装饰器)
Angular 4.x Decorator - 1
涉及装饰器定义和分类、TypeScript 类装饰器、属性装饰器、方法装饰器、参数装饰器等
Angualr 4.x Decorator - 2
涉及 Angular 4.x 类装饰器、属性装饰器、方法装饰器、参数装饰器示例
Angular 4.x Decorator - 3
涉及 Angular 4.x Metadata 分类:annotations、design:paramtypes、propMetadata、parameters 及映射关系
Angular 4.x Input
涉及 @Input、@Input('bindingPropertyName')、@Component() - inputs、setter & getter 、ngOnChanges 等
Angular 4.x Output
涉及 @Output、@Output('bindingPropertyName')、@Component() - outputs、Two-Way Data Binding、[()] 语法示例、ngModel 等
Angular 4.x Inject Decorator
涉及 @Inject 装饰器的作用、实际应用及内部实现,并解释了非 Type 类型的参数只能用 @Inject(Something) 的方式注入的原因,此外还介绍了 @Injectable、Reflect API 等
Angular 4.x ViewChild & ViewChildren
涉及 @ViewChild、@ViewChildren 装饰器使用及 @ViewChild 装饰器原理详解
Angular 4.x ContentChild & ContentChildren
涉及 @ContentChild、@ContentChildren 装饰器使用及 @ContentChild 接口及装饰器,同时介绍了 Content Projection (内容投影) 的概念及 @ContentChild 与 @ViewChild 装饰器的区别等
Angular 4.x HostListener & HostBinding
涉及 Host Element、HostListener 装饰器定义及应用、Host Event Listener、HostBinding 装饰器定义及应用、Host Property Bindings 等
Pipe(管道)
Angular 4.x Pipe
Angular 4.x 内建管道分类及使用示例、管道参数、管道链、自定义管道、管道分类、管道探秘等
Angular 4.x AsyncPipe
涉及 AsyncPipe with Promise、AsyncPipe with Observables、使用 AsyncPipe 重复发送请求的解决方案及 AsyncPipe 内部执行流程 (源码解析)
Dependency Injection(依赖注入)
Angular 4 依赖注入教程之一 依赖注入简介
涉及依赖注入的基础知识及在 Angular 中的应用
Angular 4 依赖注入教程之二 组件服务注入
涉及 Angular 服务的定义及组件中服务的注入方式
Angular 4 依赖注入教程之三 ClassProvider的使用
涉及 Angular 中 ClassProvider 的基础知识及使用
Angular 4 依赖注入教程之四 FactoryProvider的使用
涉及 Angular 中 FactoryProvider 的基础知识及使用
Angular 4 依赖注入教程之五 FactoryProvider配置依赖对象
涉及 Angular 中 FactoryProvider 如何配置依赖对象
Angular 4 依赖注入教程之六 Injectable 装饰器
涉及 Angular 中 Injectable 装饰器的作用
Angular 4 依赖注入教程之七 ValueProvider的使用
涉及 Angular 中 ValueProvider 的基础知识及使用
Angular 4 依赖注入教程之八 InjectToken的使用
涉及 Angular 中 InjectToken 的基础知识及作用
Angular 4.x IoC & DI
涉及 IoC 和 DI、DI 在 AngularJS 1.x 中的应用、内部工作原理及存在的问题等
Angular 4.x Injector
涉及依赖注入的概念及Angular 4.x 注入器的内部实现
Change Detection(变化检测)
Angular 4.x Change Detection - 1
涉及变化和变化触发源、Zones、NgZone 及如何访问 Zone 打补丁前的方法,如 setTimeout、clearTimeout 等
Angular 4.x Change Detection - 2
涉及组件和变化检测器、OnChanges、变化检测性能优化、OnPush 策略、Mutable & Immutable、ChangeDetectorRef、Observables 等
Http
Angular 4.x Http Module - HTTP
涉及 B/S、URI、MIME、HTTP请求和响应报文、HTTP 请求方法和状态码,并收录了 HTTP 经典教程和相关工具,如 Cookie 与 Session、HTTP 缓存、CORS、HTTP/2、HTTPS及常用的HTTP抓包工具、Chrome相关插件、各平台HTTP包、压力测试工具等
Angular 4.x Http Module - XMLHttpRequest
涉及 AJAX、XMLHTTP、XMLHttpRequest详解、XMLHttpRequest Level 1、Level 2 详解、XHR 上传、下载数据、XHR 流式传输、XHR 定时轮询和长轮询区别与优缺点、XMLHttpRequest 常用代码片段、常见问题等
Angular 4.x HttpModule 脑图(思维导图)
Angular 4.x HttpModule Reveal(源码揭秘)
涉及 HTTP 协议、HTTP 请求报文、HTTP 响应报文、HttpModule Request、Response、RequestOptions、ResponseOptions、XHRBackend 对象等
Angular 4.x Http Interceptor (未完成)
Form(表单)
Angular 表单控件示例
涉及 Template-driven 表单常用控件,如 text、radio、select (基本类型、对象)、multi select、cascading select (级联)、multi checkbox 等控件的使用
Angular 4.x Template Driven Forms
涉及 ngModel、[ngModel]、[(ngModel)]、ngModelGroup、Template-Driven error validation
Angular 4.x Reactive Forms
涉及 FormControl、FormGroup、Reactive Submit、Reactive Forms error validation、FormBuilder
Angular 4.x Reactive Form 表单验证
涉及 Reactive 表单内建验证规则、动态调整验证规则、自定义验证器、跨字段验证等
Angular 4.x 基于AbstractControl自定义表单验证
涉及 FormGroup、FormBuilder与FormGroup源码、AbstractControl、自定义验证规则等
Angular 4.x Custom Form Control
涉及 ControlValueAccessor、自定义验证规则等
Angular 4.x Custom Validator Directive
涉及 required、email、minlength 等内建 validators、自定义验证指令
Angular 4.x Forms patchValue and setValue
涉及 FormControl 和 FormGroup 类 patchValue() 和 setValue() 方法的使用和区别
Angular 4.x ngModel 双向绑定原理揭秘
涉及 ngModel 使用示例(单向绑定、双向绑定、ngModelOptions、disabled等)及ngModel 双向绑定实现原理
Angular 4.x Creating Dynamic Form
涉及动态创建表单的相关内容
Router
Angular 4.x 路由快速入门
涉及路由配置、动态路由、子路由、routerLink、routerLinkActive 指令及 Router API。
Angular 4.x LocationStrategy
涉及 History 对象、Hash 模式和 HTML 5模式及 Angular 中的HashLocationStrategy 和 PathLocationStrategy 策略。
Angular 4.x Router Link Directives
涉及 Angular 4.x Router 中 RouterLink、RouterLinkWithHref 及 RouterLinkActive 指令的相关内容
Events
Angular 4.x Events Bubbling
涉及 Angular 4.x 中事件冒泡机制及介绍如何基于 Angular 指令系统,实现阻止冒泡指令
Angular 4.x EventManager & Custom EventManagerPlugin
涉及 Angular 4.x 中 EventManager (事件管理器) 工作原理及介绍如何自定义 EventManagerPlugin 插件
Compiler(编译器)
Angular 4.x JIT vs AOT
涉及 Just-In-Time & Ahead-Of-Time、JIT vs AOT 、AOT 详解、AOT 实战等
Angular 4.x Compiler (未完成)
Reference Object(引用对象)
Angular 4.x ElementRef
涉及 ElementRef 的作用、定义及应用、Renderer API 常用方法
Angular 4.x TemplateRef & ViewContainerRef
涉及 HTML 5 template、TemplateRef 及 ViewContainerRef 的应用,此外介绍了 Angular 4.x 视图类型、ViewRef 与 EmbeddedViewRef 之间的关系等
RxJS
Functional Programming
涉及函数式编程概念、基础条件、重要特性、优势、常用方法等
Observable
涉及观察者、迭代器模式、Observable提案、自定义Observable、Create Operators、Observer、Pull vs Push、Observable vs Promise 等
Operators
涉及 Marble diagrams、Create Operators、Transformation Operators、Filtering Operators、Combination Operators、Utility Operators 等
Subject
涉及观察者模式定义、结构及实战、Observable subscribe、自定义 Subject、RxJS Subject、Angular 4.x RxJS Subject 应用、BehaviorSubject、ReplaySubject、AsyncSubject 等
RxJS - Observables, observers 和 operators 简介
涉及自定义 Observable、Operators 的相关知识
自定义 toJSON 操作符
涉及 RxJS 中自定义操作符的相关知识
Others(其他)
Angular 4.x ViewEncapsulation
涉及 Web Components、Shadow DOM 及 ViewEncapsulation 三种封装模式的区别
Angular 4.x constructor & ngOnInit
涉及 constructor、ngOnInit、constructor & ngOnInit 应用场景等
Angular 4.x DomSanitizer
涉及 Cross-site scripting、Angular 4.x XSS 防护、DomSanitizer、自定义 keepHtml 指令等
Angular NgModule 作用域相关问题
涉及 Angular NgModule 作用域的相关问题
Angular CLI 终极指南
涉及 Angular CLI 简介及详细介绍了 Angular CLI 支持的功能,如新建项目、单元测试、项目构建等
ng-conf-2017 - Angular Form Validation
涉及表单验证概述、同步验证、异步验证及表单验证执行流程等
- Angular 4.x 修仙之路
- Angular 4.x 修仙之路
- Angular 4.x 学习导引
- Angular之路-hello
- angular 之路 一路问题
- angular 学习之路1
- Angular 1.X初识
- express 4.x与angular最简单的通信
- NG4-详解Angular 4.x 动态创建组件
- 4.认识Angular组件之2
- angular学习之路---scope作用域
- 【前端攻城狮之路】Angular篇
- angular?!小白修仙之路……
- 我的angular学习之路之模块
- Angular系列文章之angular路由
- Angular系列文章之angular路由
- Angular系列文章之angular路由
- angular之路由,模板
- 《图解HTTP》(一)之HTTP基础
- SpringTest框架JUnit单元测试用例获取ApplicationContext实例的方法
- SpringBoot学习(一)SpringBoot基础入门
- CodeForces 815E Karen and Neighborhood题解
- redux(二) 数据流向
- Angular 4.x 修仙之路
- Python——为什么要在意:模块重载
- CodeForces 817E Choosing The Commander题解
- 【经验随笔】 Tomcat多个APP使用相同名称环境变量导致问题
- ThinkPHP 5.0 配置文件
- 调用系统时间
- 【树状数组--求逆序数(离散化)】poj2299 Ultra-QuickSort
- Groovy的灵活初始化与具名参数
- python 读写文本文件笔记