@angular装饰器总结

类装饰

装饰NgModule

@NgModule({ 
  providers?: Provider[]
  declarations?: Array<Type<any> | any[]>
  imports?: Array<Type<any> | ModuleWithProviders | any[]>
  exports?: Array<Type<any> | any[]>
  entryComponents?: Array<Type<any> | any[]>
  bootstrap?: Array<Type<any> | any[]>
  schemas?: Array<SchemaMetadata | any[]>
  id?: string
})
复制代码

装饰Component

@Component({ 
  changeDetection?: ChangeDetectionStrategy
  viewProviders?: Provider[]
  moduleId?: string
  templateUrl?: string
  template?: string
  styleUrls?: string[]
  styles?: string[]
  animations?: any[]
  encapsulation?: ViewEncapsulation
  interpolation?: [string, string]
  entryComponents?: Array<Type<any> | any[]>
  preserveWhitespaces?: boolean
  selector?: string
  inputs?: string[]
  outputs?: string[]
  host?: {...}
  providers?: Provider[]
  exportAs?: string
  queries?: {...}
})
复制代码

装饰Directive

@Directive({ 
  selector?: string
  inputs?: string[]
  outputs?: string[]
  host?: {...}
  providers?: Provider[]
  exportAs?: string
  queries?: {...}
})
复制代码

装饰Pipe

@Pipe({ 
  name: string
  pure?: boolean
})
复制代码

装饰 Injectable

@Injectable({ 
  providedIn?: Type<any> | 'root' | null
  factory: () => any
})
复制代码

属性装饰

• 属性获取

@Attribute({ 
  attributeName?: string
})
复制代码

• 宿主绑定

@HostBinding({ 
  hostPropertyName?: string
})
复制代码

• 宿主事件绑定

@HostListener({ 
  eventName?: string
  args?: string[]
})
复制代码

• 输入

@Input({ 
  bindingPropertyName?: string
})
复制代码

• 输出

@Output({ 
  bindingPropertyName?: string
})
复制代码

• 单个内容查询

@ContentChild()
复制代码

• 多个内容查询

@ContentChildren()
复制代码

• 单个视图查询

@ViewChild()
复制代码

• 多个视图查询

@ViewChildren()
复制代码

参数装饰

• 顺序检索

@Host()
复制代码

• 可空不报错，检索不到时为null

@Optional()
复制代码

• 只在自己检索

@Self()
复制代码

• 略过自身检测

@SkipSelf()
复制代码

• 用来注入被标记Injectable的类

@Inject({ 
  token: any
})
复制代码