Angular知识框架学习笔记
2022-10-19 17:21:24 0 举报AI智能生成
Angular知识框架学习笔记
作者其他创作
大纲/内容
【@】ViewChild 配置视图查询
detach()： 分离视图，组件不再变更检测，更新视图
【C】ChangeDetectorRef 变更检测
nativeElement：原生元素，直接访问宿主DOM
【C】ElementRef 可以渲染的原生元素<br>
【C】TemplateRef
@angular/core <br>
【P】CurrencyPipe
【P】DatePipe
【P】DecimalPipe
【P】PercentPipe <br>
【D】NgTemplateOutlet
@angular/common <br>
【C】Validators
@angular/forms <br>
API
分支主题
输入型绑定传值
setter监听输入值变化
通过ngOnChanges()来截听输入属性值的变化
父组件监听子组件事件
组件交互
自定义管道
内置管道
管道
:host 选择宿主元素
:host-context 在当前组件宿主元素的祖先节点中查找 CSS 类， 直到文档的根节点为止
/deep/、>>> 和 ::ng-deep（已废弃），任何带有 ::ng-deep 的样式都会变成全局样式
@imports 导入css文件到另一个css文件
组件样式
1. ngOnChanges()
2. ngOnInit()
3. ngDoCheck()
4. ngAfterContentInit()
5. ngAfterContentChecked()
6. ngAfterViewInit() 每次创建了组件的子视图后调用
7. ngAfterViewChecked()
8. ngOnDestroy()
生命周期
模板输入变量
模板引入变量
ngFor
ngSwitch
结构型指令：修改视图的结构
属性型指令：改变一个元素的外观或行为
指令
组件与模板
Subject
BehaviorSubject：只接收最新的值
AsyncSubject：程序执行完毕，只接收最后一个值
throttleTime：一定的时间内只执行第一个事件
debounceTime：一定时间之后执行一个事件
map：发送函数处理后的值
ajax
retry：设置失败之后的重试次数
RxJS
依赖注入
setValidators(newValidator: ValidatorFn | ValidatorFn[]): void
clearValidators(): void
enable(opts: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void
get(path: string | (string | number)[]): AbstractControl | null
setParent(parent: FormGroup | FormArray): void
AbstractControl：FormControl、FormGroup 和 FormArray 的基类
at(index: number): AbstractControl<br>
push(control: AbstractControl): void
removeAt(index: number): void
clear(): void
getRawValue(): any
FormArray：表单的数组控件
removeControl(name: string): void
contains(controlName: string): boolean
FormControl：跟踪一组 FormControl 实例的值和有效性状态
方法同FormControl
FormGroup
响应式表单
内置的验证器
自定义验证器
表单验证
表单
路由
动画
Angular知识框架学习笔记
0 条评论
回复 删除
下一页
