angular模块知识点

一、装饰器

@Inject() 和 @Optional()结合使用

@Inject() 装饰器用于提供一个注入令牌，告诉 Angular DI 机制需要注入哪个依赖项。
@Optional() 装饰器则是用来声明一个依赖项为可选的。

因此，在进行依赖注入时，可以同时使用 @Inject() 和 @Optional() 装饰器。
具体来说，可以将一个 @Inject() 装饰器和一个 @Optional() 装饰器放在同一个参数前面，以声明该参数既是可选的，又要注入特定的依赖项。

示例如下：

import { Component, Inject, Optional } from '@angular/core';
import { MyService } from './my-service';
import { MY_TOKEN } from './constants';

@Component({
  // ...
})
export class MyComponent {
  constructor(
    @Optional() 
    @Inject(MY_TOKEN) 
    private myService: MyService
  ) { }
}

在上述代码中，我们将 @Inject(MY_TOKEN) 和 @Optional() 装饰器都应用到了 myService 参数上，表示该参数可以接受特定的 MY_TOKEN 注入令牌对应的服务对象，同时也是可选的。如果找不到该服务，则会将该参数设置为 null。

需要注意的是，当一个参数同时使用了 @Inject() 和 @Optional() 装饰器时，它们的顺序不能颠倒。即必须先应用 @Optional() 装饰器，再应用 @Inject() 装饰器。

二、变更检测

markForCheck和detectChanges的区别

markForCheck：

ChangeDetectorRef 类中的方法，用于通知 Angular 变更检测系统检查组件及其子组件。
它会标记组件及其父组件为“脏”（dirty），表示它们的状态可能已经发生变化，需要进行变更检测。
markForCheck 的调用通常发生在一些异步操作之后，比如在回调函数中，以告诉 Angular 有可能需要重新检查组件状态。

import { ChangeDetectorRef } from '@angular/core';

constructor(private cdr: ChangeDetectorRef) {}

someAsyncOperation() {
  // 一些异步操作后
  this.cdr.markForCheck();
}

detectChanges：

ChangeDetectorRef 类中的方法，用于立即检查组件及其子组件。
当你希望手动触发变更检测，而不是等待下一次 Angular 的自动检测时，你可以使用 detectChanges。
使用得当，它可以帮助你在某些特定场景下优化性能，但一般情况下，推荐依赖于 Angular 的自动变更检测机制。

import { ChangeDetectorRef } from '@angular/core';

constructor(private cdr: ChangeDetectorRef) {}

someOperation() {
  // 一些操作后手动检查变更
  this.cdr.detectChanges();
}

总的来说，markForCheck 更多地用于告诉 Angular 变更检测系统“某些事情发生了，你可能需要检查一下”；而 detectChanges 是直接命令 Angular 立即进行变更检测。在大多数情况下，推荐使用 markForCheck，因为它更符合 Angular 的异步变更检测策略。