关于数据或事件绑定的一些语法
() 是事件绑定;[] 是属性绑定;[()] 是双向绑定,除了属性绑定外,默认会绑定到 xxxChange 事件;[(ngModel)] 也是双向绑定。
@Input() 用于声明组件接受的属性,类似于 React 的 props. @Output 声明组件对外暴露的事件。可以被消费方以 () 的形式注册 handler 使用。
依赖注入
Angular 框架实现了依赖注入功能。任何服务默认都声明为 Injectable(). 注入器(injector) 默认是 root. 也可以通过 NgModule 或 providers 等方式定义注入器。整个应用的注入器是支持多层级的结构的。对象在注入器中存取,使用 DI token 作为 key. 有时候这个 token 就是对象类型。
对象注入可以声明为 @Optional() 的,对于可选的注入对象,在使用端就要判断是否为空后再使用。
组件如何互相访问
Angular 中没有组件树,因此组件没法直接访问其他组件。但是有视图树。
每个组件对应于一个 host view 和一个 embedded view.
父子组件也可以通过依赖注入的方式进行访问,通过接口注入。
Http 访问
Angular 使用内建的 HttpClient 类来实现 http 访问。其返回值是 Rx 的 Observable 对象,因此可以被方便的订阅消费 (subscribe). 同时,还可以结合 pipe 实现更复杂的功能。基于 Rx 的 observable 的写法可以理解为 http 请求处理流程的定义蓝图(blue print),仅仅当 subscribe 的时候,才会触发真正的执行。
HttpClient 类还支持定义拦截器(interceptors). 从而实现一些中间件的功能,如附加身份认证/或其他功能所需要的 http 请求头(通过克隆并修改请求对象);日志;缓存等功能。
利用 rx 的操作符还可以实现防抖(debounce). 即,在用户输入停止一段时间后才真正发出请求,防止频繁的快速输入触发大量的 http 请求。
HttpClient 对不支持 CORS 协议的服务器,可以进行 jsonp 通信。另外,需要知道如何设置 XSRF 防护。
路由
https://angular.cn/guide/router
- 路由表的定义
- routerLink 属性
输出区域 - 嵌套子路由
- lazy 加载
- 路由守卫 (guard)