🅰️ Angular 学习路线
21 个互动教程
Angular 入门 — 企业级前端框架
Angular简介（Google开发/TypeScript/完整框架）、Angular CLI安装、ng new创建项目、项目结构、组件@Component、模块@NgModule、与React/Vue对比
Angular RxJS 与 Observable
Angular中RxJS的使用：Observable可观察对象、Subject/BehaviorSubject、pipe操作符（map/filter/debounceTime/switchMap）、async管道自动订阅/取消订阅
Angular HttpClient 网络请求
Angular HttpClient：GET/POST/PUT/DELETE、请求头拦截器Interceptor、错误处理HttpErrorResponse、进度事件（上传/下载进度）、拦截器链
Angular Standalone Components 独立组件
Angular 15+独立组件：standalone:true标志、独立组件无需@NgModule、bootstrapApplication启动、独立组件中使用依赖注入importProvidersFrom、与NgModule迁移
Angular Signals 信号
Angular 16+ Signals信号：signal()创建、computed()计算信号、effect()副作用、与RxJS Observable互转(toSignal/toObservable)、zoneless变更检测
Angular inject() 函数式注入
Angular 14+ inject()替代构造函数注入：环境Injector/元素Injector、runInInjectionContext、与DI token配合、函数式Guard/Interceptor
Angular 响应式表单深入
Angular Reactive Forms深入：FormGroup/FormArray嵌套、自定义验证器ValidatorFn/AsyncValidator、动态表单Dynamic Forms、跨字段验证Cross-Field Validation、FormRecord( Angular 14+)
Angular NgRx 状态管理
NgRx Store（Redux模式）：Action/Reducer/Effect/Selector、createAction/createReducer/createEffect、Entity Adapter管理集合、Router Store路由状态、DevTools时间旅行调试
Angular Pipes 管道深入
Angular管道：内置管道（DatePipe/CurrencyPipe/DecimalPipe/JsonPipe/AsyncPipe）、自定义Pipe（PipeTransform接口）、Pure vs Impure管道（性能影响）、管道链式组合
Angular 依赖注入深度
Angular DI深入：InjectionToken替代字符串注入token、providedIn:'root'/'platform'/'any'作用域、useFactory/useValue/useClass Provider、注入器层级（ModuleInjector/ElementInjector）
Angular 模板语法与数据绑定
Angular模板：插值{{ }}、属性绑定[property]、事件绑定(event)、双向绑定[(ngModel)]、*ngIf/*ngFor结构型指令、管道pipes（date/currency/json）
Angular SSR 服务端渲染
Angular Universal SSR：@angular/ssr、ng add @angular/ssr添加SSR、hydration客户端水合（ngSkipHydration）、pre-rendering预渲染静态页面、SEO优化
Angular 测试实践
Angular测试：TestBed.configureTestingModule配置测试模块、ComponentFixture组件测试、fakeAsync/tick控制异步、HttpTestingController模拟HTTP、Spectator简化测试
Angular 生命周期钩子深入
Angular生命周期：ngOnChanges(输入属性变化)/ngOnInit(初始化一次)/ngDoCheck(自定义变更检测)/ngAfterViewInit(DOM就绪)/ngOnDestroy(清理订阅/防止内存泄漏)、执行顺序图
Angular @ViewChild/@ViewChildren
@ViewChild/@ViewChildren查询子组件/DOM元素：static:true静态(ngOnInit可用)/static:false动态(ngAfterViewInit)、ElementRef直接操作DOM、TemplateRef嵌入模板
Angular 动画系统
Angular动画(@angular/animations)：trigger/state/transition/animate定义、query/stagger列表动画、group并行动画、keyframes关键帧、:enter/:leave路由动画、可复用动画animation函数
Angular 国际化 i18n
Angular国际化方案：@angular/localize本地化（i18n属性标记翻译文本/xlf/xliff2/xmb提取文件/xliffmerge合并翻译）、ngx-translate第三方库、AOT时编译i18n
Angular 17 新控制流语法
Angular 17+ @if/@for/@switch新控制流语法块（@defer延迟加载）：@if (condition){...}@else{...}/@for (item of items;track item.id){...}@empty{empty}/@switch/@defer(on viewport/idle/interaction/hover/timer){...}@placeh
Angular 服务与依赖注入
Angular服务：@Injectable()装饰器、providedIn:root单例/模块级/组件级、依赖注入DI层级、注入Token、useClass/useValue/useFactory Provider类型
Angular 路由与导航
Angular路由：RouterModule.forRoot/forChild、RouterLink导航、router-outlet插座、路由参数ActivatedRoute、路由守卫（canActivate/canDeactivate/resolve）、懒加载loadChildren
Angular 响应式表单
Angular响应式表单：FormControl/FormGroup/FormBuilder、Validators验证器、自定义验证器、动态表单FormArray、valueChanges监听变化、与模板驱动表单对比