angular#4

Transcript

1. Angular Marchenkov Danila, Software Developer
2. Angular is all about DI
3. All injected service dependencies are singletons meaning that, for a given dependency injector, there is only one instance of service
5. Services • Application-wide • Module-wide • Component-tree-wide • Component-wide
7. @NgModule({ imports: [ CommonModule ], declarations: [ SidebarComponent, MailboxComponent, ], providers: [ SomeService ] }) export class ComponentsModule {}
8. @Injectable()
9. Q: Only specific classes? A: NO
10. { provide: Hero, useValue: someHero }, { provide: TITLE, useValue: 'Hero of the Month' }, { provide: HeroService, useClass: HeroService }, { provide: LoggerService, useClass: DateLoggerService }, { provide: MinimalLogger, useExisting: LoggerService }, { provide: RUNNERS_UP, useFactory: runnersUpFactory(2),
11. Inject what? Inject everything • useValue • useClass • useExisting • useFactory
12. useFactory export function runnersUpFactory(take: number) { return (winner: Hero, heroService: HeroService): string => { /* ... */ }; }; { provide: RUNNERS_UP, useFactory: runnersUpFactory(2), deps: [Hero, HeroService] }
13. InjectionToken
14. import { InjectionToken } from '@angular/core'; export const TITLE = new InjectionToken<string>('title');
15. constructor( logger: MinimalLogger, public heroOfTheMonth: Hero, @Inject(RUNNERS_UP) public runnersUp: string, @Inject(TITLE) public title: string )
16. Inheriting components
17. export class ComponentA extends ComponentB { constructor( ... deps) { super(...deps); } }
18. @SkipSelf() @Optional() @Host()
19. Allows to refer to references which are not yet defined. For instance, forwardRef is used when the token which we need to refer to for the purposes of DI is declared, but not yet defined. It is also used when the token which we use when creating a query is not yet defined. class Door { lock: Lock; // Door attempts to inject Lock, despite it not being defined yet. // forwardRef makes this possible. constructor(@Inject(forwardRef(() => Lock)) lock: Lock) { this.lock = lock; } } // Only at this point Lock is defined. class Lock {} const injector = ReflectiveInjector.resolveAndCreate([Door, Lock]); const door = injector.get(Door); expect(door instanceof Door).toBeTruthy(); expect(door.lock instanceof Lock).toBeTruthy(); forwardRef