blog-angular
blog-angular copied to clipboard
Published
20 hours ago •
deepthan
deepthan
Angular 笔记
目前版本:
Angular回忆录
一个关于Angular的学习和使用笔记。
希望可以帮到你，也希望有更多人使用Angular~
| Author | deepthan |
|---|---|
| [email protected] |
概念理解
脚手架 Angular cli
装饰器@
路由 router
- RouterLink
- navigateByUrl vs navigate
- routerLink和routerLinkActive动态传参
- Routes介绍
- 路由高亮--长明灯RouterLinkActive
- 路由守卫，拦截懒加载，拦截预加载，离开验证
- 预加载
- Angular2+去除url中的#
- 获取当前路由
组件 Component
指令 Directive
- ngIf
- ngFor
- ngSwitch
- ngClass
- ngStyle
- ng-template
- ng-content
- ng-container vs ngTemplateOutlet
- NgTemplateOutlet
- Angular如何自定义指令
- 如何根据条件决定是否添加指令
- 一个文件中同一段html被多次用到怎么抽离
- ngPreserveWhitespaces和NgNonBindable
管道 Pipe
动画
- trigger
- state
- transition
- animate
- style
- keyframes
- query
- sequence
- group
- AnimationOptions
- Web Animations API ： Angular动画基准
DOM
事件
表单表格
- 获取表单的值
- 设置表单值 FormControl setValue
- 如何禁用表单
- 如何提取table中tr为组件
- Angular 2, NgModel and Custom Form Components
- How to create custom input component with ngModel working in angular?
- never-again-be-confused-when-implementing-controlvalueaccessor-in-angular-forms
安全 Security
变化检测
- edu-angular-change-detection : 图形化地显示变化过程
- Angular：单向数据流
- Angular Change Detection：变化检测机制
- ngular Change Detection：变化检测策略
- Angular变化检测机制：改善的脏检查
- [译] 你真的知道 Angular 单向数据流吗
- Angular DOM 更新机制
- 10 Things Every Angular Developer Should Know About Zone.js
- Understanding Zones
- Angular Elements without Zone.Js
- How Angular uses NgZone/Zone.js for Dirty Checking
配置文件
摇树优化 tree shaking
兼容性
打包优化
- 一招让Angular-cli速度增强
- How to speed up the Angular build process
- AOT build fails due to "JavaScript heap out of memory"
第三方库集成
- augury: : Angular调试和可视化工具
- 集成富文本编辑器 tinymce
- tinymce使用方法和踩坑指南
- 国际化集成ngx-translate
- 集成echart
- 集成font-awesome
- 集成ng-zorro-antd
- 集成push.js
- 集成提示框
- 集成预览表格内容js-xlsx
代码规范
Angualr CDK
npm 包开发
开发中报错解决
- No NgModule metadata found for 'AppModule'.
- No value accessor for form control with name xxx
- Can't bind to 'ngModel' since it isn't a known property of 'input'.
- No provider for ChildrenOutletContexts (injectionError)
- RangeError Maximum call stack size exceeded 最大调用堆栈大小超出
- ngIf的时候报No provider for TemplateRef!
- ngular TypeError “remove”TypeError 无法获取未定义或 null 引用的属性“remove”
- sockjs-node请求报 400
- typescript getting error TS2304 cannot find name ' require'
- 本地运行不报错但是打包到服务器报不知名错误
- 打包报错,内存不够或溢出
- 关于npm的错误
- 关于function 、lambda、not supported等
- 关于polyfills.ts、'es5-shim'、'es6-shim'
- 关于Observable、map的问题
- 关于'Http' is not assignable to parameter of type 'Http'
- 关于找不到模块
- Can't bind to 'formGroup' since it isn't a known property of 'form'
- ERROR in Error: Debug Failure. False expression.
- 关于node-sass里面 vendor 缺失
- 关于phantormjs
- 关于找不到 require或者module
单元测试 Unit Test
端到端测试 E2E
- Angular e2e 介绍
- E2E测试
- E2E报错
- protractor-styleguide : 编码风格指南
- protractortest 官网
- tutorial : E2E教学
- Protractor API
- introduction-to-e2e-testing-with-the-angular-cli-and-protractor：Cory Rylan写的E2E指导
- ng-pokedex: Cory Rylan写的E2E配套案例项目
- End to End(E2E) Tests in Angular Application Using Protractor
- Automate End to end (e2e) testing for Angular 7 using Protractor & Jasmine
Angular 升级
服务端渲染
实用技巧
- hidden属性
- 获取document、window
- 包的加载速度优化
- 如何覆盖第三方库css
- 如何换个端口启动项目？
- 如何让别人可以访问自己本地启动的服务
- 项目中引入图片之类静态资源文件方法
- 在页面打印出json对象
- github上搜索angular的正确姿势
- how-to-use-angular-console
- 48-answers-on-stack-overflow-to-the-most-popular-angular-questions
好用的vscode 插件
好用的工具
- 网页性能分析
- caniuse.com ： 查询兼容性
- abbreviations ： 查询单词缩写，妈妈再也不担心我写出魔鬼缩写了。
- 代码示例网站 stackblitz
- 代码示例网站 jshare
- json转换
- axure : 原型工具
- 在线加密解密
Angular及相关技术网站
Angular
- Angular 官网：中文文档 | 英文文档 | github
- Angular 脚手架：中文官网 | github
- Angular cdk：中文 | 英文
- ngrx : Angular状态管理
- 手把手教你用ngrx管理Angular状态
- Angular Console — The UI for the Angular CLI : Angular界面化操作
- bit
Typescript
- 官网
- Typescript入门教程 : 较为系统，推荐学习下
rxjs
- rxjs5 基本原理 : 中文官网 | 英文官网
- rxjs实战
- rxjs 优质翻译文章
- 官方中文文档操作符篇 : 中文 | 英文
- 学习 rxjs 操作符
- 词汇表
- 构建流式应用—RxJS详解
- 官方出品--rxjs视频教学（英）
Angular 教程
- Angular 2 之一 系统架构 : 偏基础
- angular-university
- Angular 2 Training 中文版
- Angular 4.x 修仙之路 : 质量较高的系列教程
- Angular 2.x 从0到1 : 现已成书
- limeii Angular 博客： 国内女性Angular开发者，写的内容挺好
- Angular 2入门 : 汇智网的视频教学
- angular-education : 学习资源汇总
- Angular 大師之路
- ultimatecourses.com
- appdividend.com
- medium.com : 里面很多高质量博客
- learnangularjs.net
Angular案例项目
- angular-starter ： 用webpack配置的angular项目，带有很多功能
- ng-alain :ng-zorro的维护者开源的一个后台管理系统
- ngx-admin
UI库
- ng-zorro-antd：阿里开源的 ant design风格的UI库，功能较全。
- ngx-bootstrap：angular版本bootsrap库
- Angular Material：Angular团队开源的组件库，功能不够强大，需要二次封装
- PrimeNG
- FreeNG
- angular-grid : Angular 表格
- ng-devui : 华为云DevCloud，基于Angular的企业级前端组件库
deepthan