DEV Community
·
Angular 19新特性 - ngComponentOutlet的componentInstance
💡
原文英文，约1000词，阅读约需4分钟。
📝
内容提要
Angular 19.1.0增强了ngComponentOutlet指令，新增componentInstance以便开发者直接与动态组件交互。示例中创建了Admin和User组件，并通过AdminGreetingService服务设置问候语，支持动态渲染和权限管理。
🎯
关键要点
- Angular 19.1.0增强了ngComponentOutlet指令，新增componentInstance以便开发者直接与动态组件交互。
- componentInstance允许开发者在组件创建后访问其输入和方法，便于直接交互。
- AdminGreetingService服务用于设置问候语，支持动态渲染和权限管理。
- UserFormComponent包含输入字段和单选按钮，用户选择后动态渲染AdminComponent或UserComponent。
- AdminComponent和UserComponent都有三个信号输入，包含类型、权限和名称，并有getGreeting方法返回问候语。
- GREETING_TOKEN是一个注入令牌，提供setGreeting函数的实现。
- configs对象映射动态组件、权限输入和注入器。
- App组件使用ngComponentOutlet动态渲染组件，并通过componentInstance访问组件的方法和服务。
- concatPermissions方法用于连接渲染组件的权限输入，并更新permissionsString信号。
- componentInstance使Angular开发者能够调用组件的信号、输入、方法和内部服务。
➡️
