Skip to content

refactor(*): migrate DI from constructors to inject() API #16075

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { ChangeDetectorRef, Component, QueryList, TemplateRef, ViewChildren } from '@angular/core';
import { ChangeDetectorRef, Component, QueryList, TemplateRef, ViewChildren, inject } from '@angular/core';
import { Subject } from 'rxjs';
import { TemplateRefWrapper } from './template-ref-wrapper';

Expand All @@ -13,6 +13,8 @@ type TemplateFunction = (arg: any) => TemplateResult;
imports: []
})
export class TemplateWrapperComponent {
private cdr = inject(ChangeDetectorRef);


public templateFunctions: TemplateFunction[] = [];
public templateRendered = new Subject<HTMLElement>();
Expand All @@ -25,8 +27,6 @@ export class TemplateWrapperComponent {
*/
@ViewChildren(TemplateRef)
public templateRefs: QueryList<TemplateRef<any>>;

constructor(private cdr: ChangeDetectorRef) { }

protected litRender(container: HTMLElement, templateFunc: (arg: any) => TemplateResult, arg: any) {
const part = render(templateFunc(arg), container);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ActionType, BroadcastIconsChangeMessage, IgxIconBroadcastService, SvgIcon, } from './icon.broadcast.service';
import { Component, SecurityContext } from '@angular/core';
import { Component, SecurityContext, inject } from '@angular/core';
import { IconMeta, IgxIconService } from 'igniteui-angular';
import { wait } from 'igniteui-angular/src/lib/test-utils/ui-interactions.spec';

Expand Down Expand Up @@ -111,5 +111,6 @@ describe('Icon broadcast service', () => {
providers: [IgxIconBroadcastService, IgxIconService]
})
export class BroadcastServiceComponent {
constructor(public iconBroadcast: IgxIconBroadcastService, public iconService: IgxIconService) {}
iconBroadcast = inject(IgxIconBroadcastService);
iconService = inject(IgxIconService);
}
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Injectable, Optional } from '@angular/core';
import { Injectable, inject } from '@angular/core';
import { PlatformUtil } from '../../../igniteui-angular/src/lib/core/utils';
import { IgxIconService } from '../../../igniteui-angular/src/lib/icon/icon.service';
import { IconMeta } from '../../../igniteui-angular/src/lib/icon/public_api';
Expand Down Expand Up @@ -26,12 +26,12 @@ export interface BroadcastIconsChangeMessage {
/** @hidden @internal **/
@Injectable()
export class IgxIconBroadcastService {
protected _iconService = inject(IgxIconService);
private _platformUtil = inject(PlatformUtil, { optional: true });

private iconBroadcastChannel: BroadcastChannel | null;

constructor(
protected _iconService: IgxIconService,
@Optional() private _platformUtil: PlatformUtil
) {
constructor() {
if (this._platformUtil?.isBrowser) {
this.create();

Expand Down
23 changes: 16 additions & 7 deletions projects/igniteui-angular-elements/src/lib/state.component.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Component, EnvironmentInjector, EventEmitter, Inject, Injector, Output, ViewContainerRef } from '@angular/core';
import { Component, EnvironmentInjector, EventEmitter, Injector, Output, ViewContainerRef, inject } from '@angular/core';
import { IPinningConfig, GridType, IGX_GRID_BASE} from '../../../igniteui-angular/src/lib/grids/common/grid.interface';
import { IFilteringExpressionsTree } from '../../../igniteui-angular/src/lib/data-operations/filtering-expressions-tree';
import { IPagingState } from '../../../igniteui-angular/src/lib/data-operations/paging-state.interface';
Expand Down Expand Up @@ -50,14 +50,23 @@ export interface IGridStateInfo {
standalone: true
})
export class IgxGridStateComponent extends IgxGridStateBaseDirective {
protected override viewRef: ViewContainerRef;
protected override envInjector: EnvironmentInjector;
protected override injector: Injector;


constructor() {
const grid = inject<GridType>(IGX_GRID_BASE);
const viewRef = inject(ViewContainerRef);
const envInjector = inject(EnvironmentInjector);
const injector = inject(Injector);

constructor(
@Inject(IGX_GRID_BASE) grid: GridType,
protected override viewRef: ViewContainerRef, protected override envInjector: EnvironmentInjector,
protected override injector: Injector,
) {
super(grid, viewRef, envInjector, injector);
}

this.viewRef = viewRef;
this.envInjector = envInjector;
this.injector = injector;
}

/**
* Restores grid features' state based on the IGridStateInfo object passed as an argument.
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,4 @@
import {
AfterContentInit, AfterViewInit, ChangeDetectorRef, Component, ContentChildren, EventEmitter,
HostBinding, Input, OnDestroy, Output, QueryList, booleanAttribute
} from '@angular/core';
import { AfterContentInit, AfterViewInit, ChangeDetectorRef, Component, ContentChildren, EventEmitter, HostBinding, Input, OnDestroy, Output, QueryList, booleanAttribute, inject } from '@angular/core';
import { fromEvent, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { ACCORDION_NAVIGATION_KEYS } from '../core/utils';
Expand Down Expand Up @@ -55,6 +52,8 @@ let NEXT_ID = 0;
standalone: true
})
export class IgxAccordionComponent implements AfterContentInit, AfterViewInit, OnDestroy {
private cdr = inject(ChangeDetectorRef);

/**
* Get/Set the `id` of the accordion component.
* Default value is `"igx-accordion-0"`;
Expand Down Expand Up @@ -216,8 +215,6 @@ export class IgxAccordionComponent implements AfterContentInit, AfterViewInit, O
private _enabledPanels!: IgxExpansionPanelComponent[];
private _singleBranchExpand = false;

constructor(private cdr: ChangeDetectorRef) { }

/** @hidden @internal **/
public ngAfterContentInit(): void {
this.updatePanelsAnimation();
Expand Down
Original file line number Diff line number Diff line change
@@ -1,20 +1,4 @@
import {
Component,
Directive,
HostBinding,
Input,
Renderer2,
ViewContainerRef,
ContentChildren,
QueryList,
ViewChild,
TemplateRef,
AfterContentInit,
ChangeDetectorRef,
AfterViewInit,
ElementRef,
booleanAttribute
} from '@angular/core';
import { Component, Directive, HostBinding, Input, Renderer2, ViewContainerRef, ContentChildren, QueryList, ViewChild, TemplateRef, AfterContentInit, ChangeDetectorRef, AfterViewInit, ElementRef, booleanAttribute, inject } from '@angular/core';
import { ActionStripResourceStringsEN, IActionStripResourceStrings } from '../core/i18n/action-strip-resources';
import { IgxDropDownComponent } from '../drop-down/drop-down.component';
import { CloseScrollStrategy, OverlaySettings } from '../services/public_api';
Expand All @@ -35,7 +19,7 @@ import { trackByIdentity } from '../core/utils';
standalone: true
})
export class IgxActionStripMenuItemDirective {
constructor(public templateRef: TemplateRef<any>) {}
public templateRef = inject<TemplateRef<any>>(TemplateRef);
}

/* blazorElement */
Expand Down Expand Up @@ -86,6 +70,11 @@ export class IgxActionStripMenuItemDirective {
providers: [{ provide: IgxActionStripToken, useExisting: IgxActionStripComponent }]
})
export class IgxActionStripComponent implements IgxActionStripToken, AfterContentInit, AfterViewInit {
private _viewContainer = inject(ViewContainerRef);
private renderer = inject(Renderer2);
protected el = inject(ElementRef);
public cdr = inject(ChangeDetectorRef);


/* blazorSuppress */
/**
Expand Down Expand Up @@ -191,14 +180,6 @@ export class IgxActionStripComponent implements IgxActionStripToken, AfterConten
private _resourceStrings = getCurrentResourceStrings(ActionStripResourceStringsEN);
private _originalParent!: HTMLElement;

constructor(
private _viewContainer: ViewContainerRef,
private renderer: Renderer2,
protected el: ElementRef,
/** @hidden @internal **/
public cdr: ChangeDetectorRef,
) { }

/**
* Menu Items list.
*
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { IgxGridActionButtonComponent } from './grid-action-button.component';
import { Directive, Input, AfterViewInit, QueryList, ViewChildren, IterableDiffers, booleanAttribute } from '@angular/core';
import { Directive, Input, AfterViewInit, QueryList, ViewChildren, IterableDiffers, booleanAttribute, inject } from '@angular/core';
import { IgxActionStripComponent } from '../action-strip.component';
import { IgxRowDirective } from '../../grids/row.directive';
import { IgxIconService } from '../../icon/icon.service';
Expand All @@ -14,6 +14,9 @@ import { IgxIconService } from '../../icon/icon.service';
standalone: true
})
export class IgxGridActionsBaseDirective implements AfterViewInit {
protected iconService = inject(IgxIconService);
protected differs = inject(IterableDiffers);

/** @hidden @internal **/
@ViewChildren(IgxGridActionButtonComponent)
public buttons: QueryList<IgxGridActionButtonComponent>;
Expand Down Expand Up @@ -51,9 +54,6 @@ export class IgxGridActionsBaseDirective implements AfterViewInit {
return this.isRow(this.strip?.context) && !this.strip.context.inEditMode;
}

constructor(protected iconService: IgxIconService,
protected differs: IterableDiffers) { }

/**
* @hidden
* @internal
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import { IgxGridPinningActionsComponent } from './grid-pinning-actions.component
import { IgxActionStripComponent } from '../action-strip.component';
import { IRowDataCancelableEventArgs, IgxColumnComponent } from '../../grids/public_api';
import { SampleTestData } from '../../test-utils/sample-test-data.spec';
import { IgxGridNavigationService } from '../../grids/grid-navigation.service';

describe('igxGridEditingActions #grid ', () => {
let fixture;
Expand All @@ -31,6 +32,9 @@ describe('igxGridEditingActions #grid ', () => {
IgxActionStripEditMenuComponent,
IgxActionStripOneRowComponent,
IgxActionStripMenuOneRowComponent
],
providers: [
IgxGridNavigationService
]
}).compileComponents();
}));
Expand Down
14 changes: 3 additions & 11 deletions projects/igniteui-angular/src/lib/avatar/avatar.component.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,5 @@
import { NgTemplateOutlet } from '@angular/common';
import {
Component,
ElementRef,
HostBinding,
Input,
OnInit,
TemplateRef,
ViewChild
} from '@angular/core';
import { Component, ElementRef, HostBinding, Input, OnInit, TemplateRef, ViewChild, inject } from '@angular/core';

import { normalizeURI } from '../core/utils';
import { IgxIconComponent } from '../icon/icon.component';
Expand Down Expand Up @@ -56,6 +48,8 @@ export type IgxAvatarType = (typeof IgxAvatarType)[keyof typeof IgxAvatarType];
imports: [IgxIconComponent, NgTemplateOutlet]
})
export class IgxAvatarComponent implements OnInit {
public elementRef = inject(ElementRef);

/**
* Returns the `aria-label` attribute of the avatar.
*
Expand Down Expand Up @@ -332,8 +326,6 @@ export class IgxAvatarComponent implements OnInit {
}
}

constructor(public elementRef: ElementRef) { }

/**
* Returns the css url of the image.
*
Expand Down
15 changes: 3 additions & 12 deletions projects/igniteui-angular/src/lib/banner/banner.component.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,4 @@
import {
Component,
ContentChild,
ElementRef,
EventEmitter,
HostBinding,
Input,
Output,
ViewChild
} from '@angular/core';
import { Component, ContentChild, ElementRef, EventEmitter, HostBinding, Input, Output, ViewChild, inject } from '@angular/core';

import { IgxIconComponent } from '../icon/icon.component';
import { IToggleView } from '../core/navigation';
Expand Down Expand Up @@ -51,6 +42,8 @@ export interface BannerCancelEventArgs extends BannerEventArgs, CancelableEventA
imports: [IgxExpansionPanelComponent, IgxExpansionPanelBodyComponent, IgxButtonDirective, IgxRippleDirective]
})
export class IgxBannerComponent implements IToggleView {
public elementRef = inject<ElementRef<HTMLElement>>(ElementRef);

/**
* @hidden
*/
Expand Down Expand Up @@ -237,8 +230,6 @@ export class IgxBannerComponent implements IToggleView {
private _animationSettings: ToggleAnimationSettings;
private _resourceStrings = getCurrentResourceStrings(BannerResourceStringsEN);

constructor(public elementRef: ElementRef<HTMLElement>) { }

/**
* Opens the banner
*
Expand Down
Original file line number Diff line number Diff line change
@@ -1,19 +1,4 @@
import {
AfterViewInit,
Component,
ContentChildren,
ChangeDetectorRef,
EventEmitter,
HostBinding,
Input,
Output,
QueryList,
Renderer2,
ViewChildren,
OnDestroy,
ElementRef,
booleanAttribute
} from '@angular/core';
import { AfterViewInit, Component, ContentChildren, ChangeDetectorRef, EventEmitter, HostBinding, Input, Output, QueryList, Renderer2, ViewChildren, OnDestroy, ElementRef, booleanAttribute, inject } from '@angular/core';
import { Subject } from 'rxjs';
import { IgxButtonDirective } from '../directives/button/button.directive';
import { IgxRippleDirective } from '../directives/ripple/ripple.directive';
Expand Down Expand Up @@ -59,6 +44,10 @@ let NEXT_ID = 0;
imports: [IgxButtonDirective, IgxRippleDirective, IgxIconComponent]
})
export class IgxButtonGroupComponent implements AfterViewInit, OnDestroy {
private _cdr = inject(ChangeDetectorRef);
private _renderer = inject(Renderer2);
private _el = inject(ElementRef);

/**
* A collection containing all buttons inside the button group.
*/
Expand Down Expand Up @@ -309,12 +298,6 @@ export class IgxButtonGroupComponent implements AfterViewInit, OnDestroy {
subtree: true,
};

constructor(
private _cdr: ChangeDetectorRef,
private _renderer: Renderer2,
private _el: ElementRef
) {}

/**
* Gets the selected button/buttons.
* ```typescript
Expand Down
17 changes: 9 additions & 8 deletions projects/igniteui-angular/src/lib/calendar/calendar-base.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Input, Output, EventEmitter, Directive, Inject, LOCALE_ID, HostListener, booleanAttribute, ViewChildren, QueryList, ElementRef, ChangeDetectorRef } from '@angular/core';
import { Input, Output, EventEmitter, Directive, LOCALE_ID, HostListener, booleanAttribute, ViewChildren, QueryList, ElementRef, ChangeDetectorRef, inject } from '@angular/core';
import { WEEKDAYS, IFormattingOptions, IFormattingViews, IViewDateChangeEventArgs, ScrollDirection, IgxCalendarView, CalendarSelection } from './calendar';
import { ControlValueAccessor } from '@angular/forms';
import { DateRangeDescriptor } from '../core/dates';
Expand All @@ -19,6 +19,11 @@ import { CalendarDay } from './common/model';
providers: [KeyboardNavigationService]
})
export class IgxCalendarBaseDirective implements ControlValueAccessor {
protected platform = inject(PlatformUtil);
protected _localeId = inject(LOCALE_ID);
protected keyboardNavigation? = inject(KeyboardNavigationService);
protected cdr? = inject(ChangeDetectorRef);

/**
* Holds month view index we are operating on.
*/
Expand Down Expand Up @@ -649,13 +654,9 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor {
/**
* @hidden
*/
constructor(
protected platform: PlatformUtil,
@Inject(LOCALE_ID)
protected _localeId: string,
protected keyboardNavigation?: KeyboardNavigationService,
protected cdr?: ChangeDetectorRef,
) {
constructor() {
const _localeId = this._localeId;

this.locale = _localeId;
this.viewDate = this.viewDate ? this.viewDate : new Date();
this.initFormatters();
Expand Down
Loading