docs: fix strict property initialization errors

crisbeto · crisbeto · commit b4fe00f8927a · 2025-12-17T14:53:54.000+02:00
Updates the code to be compatible with strict property initialization.
diff --git a/src/components-examples/cdk/a11y/focus-monitor-focus-via/focus-monitor-focus-via-example.ts b/src/components-examples/cdk/a11y/focus-monitor-focus-via/focus-monitor-focus-via-example.ts
@@ -24,7 +24,7 @@ export class FocusMonitorFocusViaExample implements OnDestroy, AfterViewInit {
   private _cdr = inject(ChangeDetectorRef);
   private _ngZone = inject(NgZone);
 
-  @ViewChild('monitored') monitoredEl: ElementRef<HTMLElement>;
+  @ViewChild('monitored') monitoredEl!: ElementRef<HTMLElement>;
 
   origin = this.formatOrigin(null);
 
diff --git a/src/components-examples/cdk/a11y/focus-monitor-overview/focus-monitor-overview-example.ts b/src/components-examples/cdk/a11y/focus-monitor-overview/focus-monitor-overview-example.ts
@@ -21,8 +21,8 @@ export class FocusMonitorOverviewExample implements OnDestroy, AfterViewInit {
   private _cdr = inject(ChangeDetectorRef);
   private _ngZone = inject(NgZone);
 
-  @ViewChild('element') element: ElementRef<HTMLElement>;
-  @ViewChild('subtree') subtree: ElementRef<HTMLElement>;
+  @ViewChild('element') element!: ElementRef<HTMLElement>;
+  @ViewChild('subtree') subtree!: ElementRef<HTMLElement>;
 
   elementOrigin = this.formatOrigin(null);
   subtreeOrigin = this.formatOrigin(null);
diff --git a/src/components-examples/cdk/dialog/cdk-dialog-overview/cdk-dialog-overview-example.ts b/src/components-examples/cdk/dialog/cdk-dialog-overview/cdk-dialog-overview-example.ts
@@ -19,7 +19,7 @@ export class CdkDialogOverviewExample {
   dialog = inject(Dialog);
 
   animal: string | undefined;
-  name: string;
+  name!: string;
 
   openDialog(): void {
     const dialogRef = this.dialog.open<string>(CdkDialogOverviewExampleDialog, {
diff --git a/src/components-examples/cdk/drag-drop/cdk-drag-drop-root-element/cdk-drag-drop-root-element-example.ts b/src/components-examples/cdk/drag-drop/cdk-drag-drop-root-element/cdk-drag-drop-root-element-example.ts
@@ -25,9 +25,9 @@ export class CdkDragDropRootElementExample implements AfterViewInit, OnDestroy {
   private _injector = inject(Injector);
   private _viewContainerRef = inject(ViewContainerRef);
 
-  @ViewChild(TemplateRef) _dialogTemplate: TemplateRef<any>;
-  private _overlayRef: OverlayRef;
-  private _portal: TemplatePortal;
+  @ViewChild(TemplateRef) _dialogTemplate!: TemplateRef<any>;
+  private _overlayRef!: OverlayRef;
+  private _portal!: TemplatePortal;
 
   ngAfterViewInit() {
     this._portal = new TemplatePortal(this._dialogTemplate, this._viewContainerRef);
diff --git a/src/components-examples/cdk/drag-drop/cdk-drag-drop-table/cdk-drag-drop-table-example.ts b/src/components-examples/cdk/drag-drop/cdk-drag-drop-table/cdk-drag-drop-table-example.ts
@@ -34,7 +34,7 @@ export const ELEMENT_DATA: PeriodicElement[] = [
   imports: [CdkDropList, CdkDrag, MatTableModule, MatIconModule],
 })
 export class CdkDragDropTableExample {
-  @ViewChild('table', {static: true}) table: MatTable<PeriodicElement>;
+  @ViewChild('table', {static: true}) table!: MatTable<PeriodicElement>;
 
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol', 'quantity'];
   dataSource = ELEMENT_DATA;
diff --git a/src/components-examples/cdk/layout/breakpoint-observer-overview/breakpoint-observer-overview-example.ts b/src/components-examples/cdk/layout/breakpoint-observer-overview/breakpoint-observer-overview-example.ts
@@ -11,7 +11,7 @@ import {takeUntil} from 'rxjs/operators';
 })
 export class BreakpointObserverOverviewExample implements OnDestroy {
   destroyed = new Subject<void>();
-  currentScreenSize: string;
+  currentScreenSize!: string;
 
   // Create a map to display breakpoint names for demonstration purposes.
   displayNameMap = new Map([
diff --git a/src/components-examples/cdk/portal/cdk-portal-overview/cdk-portal-overview-example.ts b/src/components-examples/cdk/portal/cdk-portal-overview/cdk-portal-overview-example.ts
@@ -27,13 +27,13 @@ import {
 export class CdkPortalOverviewExample implements AfterViewInit {
   private _viewContainerRef = inject(ViewContainerRef);
 
-  @ViewChild('templatePortalContent') templatePortalContent: TemplateRef<unknown>;
-  @ViewChild('domPortalContent') domPortalContent: ElementRef<HTMLElement>;
+  @ViewChild('templatePortalContent') templatePortalContent!: TemplateRef<unknown>;
+  @ViewChild('domPortalContent') domPortalContent!: ElementRef<HTMLElement>;
 
-  selectedPortal: Portal<any>;
-  componentPortal: ComponentPortal<ComponentPortalExample>;
-  templatePortal: TemplatePortal<any>;
-  domPortal: DomPortal<any>;
+  selectedPortal!: Portal<any>;
+  componentPortal!: ComponentPortal<ComponentPortalExample>;
+  templatePortal!: TemplatePortal<any>;
+  domPortal!: DomPortal<any>;
 
   ngAfterViewInit() {
     this.componentPortal = new ComponentPortal(ComponentPortalExample);
diff --git a/src/components-examples/cdk/text-field/text-field-autofill-directive/text-field-autofill-directive-example.ts b/src/components-examples/cdk/text-field/text-field-autofill-directive/text-field-autofill-directive-example.ts
@@ -12,6 +12,6 @@ import {MatFormFieldModule} from '@angular/material/form-field';
   imports: [MatFormFieldModule, MatInputModule, TextFieldModule, MatButtonModule],
 })
 export class TextFieldAutofillDirectiveExample {
-  firstNameAutofilled: boolean;
-  lastNameAutofilled: boolean;
+  firstNameAutofilled = false;
+  lastNameAutofilled = false;
 }
diff --git a/src/components-examples/cdk/text-field/text-field-autofill-monitor/text-field-autofill-monitor-example.ts b/src/components-examples/cdk/text-field/text-field-autofill-monitor/text-field-autofill-monitor-example.ts
@@ -14,10 +14,10 @@ import {MatFormFieldModule} from '@angular/material/form-field';
 export class TextFieldAutofillMonitorExample implements AfterViewInit, OnDestroy {
   private _autofill = inject(AutofillMonitor);
 
-  @ViewChild('first', {read: ElementRef}) firstName: ElementRef<HTMLElement>;
-  @ViewChild('last', {read: ElementRef}) lastName: ElementRef<HTMLElement>;
-  firstNameAutofilled: boolean;
-  lastNameAutofilled: boolean;
+  @ViewChild('first', {read: ElementRef}) firstName!: ElementRef<HTMLElement>;
+  @ViewChild('last', {read: ElementRef}) lastName!: ElementRef<HTMLElement>;
+  firstNameAutofilled = false;
+  lastNameAutofilled = false;
 
   ngAfterViewInit() {
     this._autofill
diff --git a/src/components-examples/cdk/text-field/text-field-autosize-textarea/text-field-autosize-textarea-example.ts b/src/components-examples/cdk/text-field/text-field-autosize-textarea/text-field-autosize-textarea-example.ts
@@ -14,7 +14,7 @@ import {MatFormFieldModule} from '@angular/material/form-field';
 export class TextFieldAutosizeTextareaExample {
   private _injector = inject(Injector);
 
-  @ViewChild('autosize') autosize: CdkTextareaAutosize;
+  @ViewChild('autosize') autosize!: CdkTextareaAutosize;
 
   triggerResize() {
     // Wait for content to render, then trigger textarea resize.
diff --git a/src/components-examples/cdk/tree/cdk-tree-flat-level-accessor/cdk-tree-flat-level-accessor-example.ts b/src/components-examples/cdk/tree/cdk-tree-flat-level-accessor/cdk-tree-flat-level-accessor-example.ts
@@ -24,7 +24,7 @@ interface FlatFoodNode {
 })
 export class CdkTreeFlatLevelAccessorExample {
   @ViewChild(CdkTree)
-  tree: CdkTree<FlatFoodNode>;
+  tree!: CdkTree<FlatFoodNode>;
 
   levelAccessor = (dataNode: FlatFoodNode) => dataNode.level;
 
diff --git a/src/components-examples/cdk/tree/cdk-tree-nested-children-accessor/cdk-tree-nested-children-accessor-example.ts b/src/components-examples/cdk/tree/cdk-tree-nested-children-accessor/cdk-tree-nested-children-accessor-example.ts
@@ -35,7 +35,7 @@ function flattenNodes(nodes: NestedFoodNode[]): NestedFoodNode[] {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class CdkTreeNestedChildrenAccessorExample {
-  @ViewChild(CdkTree) tree: CdkTree<NestedFoodNode>;
+  @ViewChild(CdkTree) tree!: CdkTree<NestedFoodNode>;
 
   childrenAccessor = (dataNode: NestedFoodNode) => dataNode.children ?? [];
 
diff --git a/src/components-examples/cdk/tree/cdk-tree-nested-level-accessor/cdk-tree-nested-level-accessor-example.ts b/src/components-examples/cdk/tree/cdk-tree-nested-level-accessor/cdk-tree-nested-level-accessor-example.ts
@@ -23,7 +23,7 @@ interface FlatFoodNode {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class CdkTreeNestedLevelAccessorExample {
-  @ViewChild(CdkTree) tree: CdkTree<FlatFoodNode>;
+  @ViewChild(CdkTree) tree!: CdkTree<FlatFoodNode>;
 
   levelAccessor = (dataNode: FlatFoodNode) => dataNode.level;
 
diff --git a/src/components-examples/example-data.ts b/src/components-examples/example-data.ts
@@ -8,19 +8,19 @@ import {EXAMPLE_COMPONENTS} from './example-module';
  */
 export class ExampleData {
   /** Description of the example. */
-  description: string;
+  description!: string;
 
   /** List of files that are part of this example. */
-  exampleFiles: string[];
+  exampleFiles!: string[];
 
   /** Selector name of the example component. */
-  selectorName: string;
+  selectorName!: string;
 
   /** Name of the file that contains the example component. */
-  indexFilename: string;
+  indexFilename!: string;
 
   /** Names of the components being used in this example. */
-  componentNames: string[];
+  componentNames!: string[];
 
   constructor(example: string) {
     if (!example || !EXAMPLE_COMPONENTS.hasOwnProperty(example)) {
diff --git a/src/components-examples/material/autocomplete/autocomplete-auto-active-first-option/autocomplete-auto-active-first-option-example.ts b/src/components-examples/material/autocomplete/autocomplete-auto-active-first-option/autocomplete-auto-active-first-option-example.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component} from '@angular/core';
 import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {Observable} from 'rxjs';
 import {map, startWith} from 'rxjs/operators';
@@ -23,12 +23,12 @@ import {MatFormFieldModule} from '@angular/material/form-field';
     AsyncPipe,
   ],
 })
-export class AutocompleteAutoActiveFirstOptionExample implements OnInit {
+export class AutocompleteAutoActiveFirstOptionExample {
   myControl = new FormControl('');
   options: string[] = ['One', 'Two', 'Three'];
   filteredOptions: Observable<string[]>;
 
-  ngOnInit() {
+  constructor() {
     this.filteredOptions = this.myControl.valueChanges.pipe(
       startWith(''),
       map(value => this._filter(value || '')),
diff --git a/src/components-examples/material/autocomplete/autocomplete-display/autocomplete-display-example.ts b/src/components-examples/material/autocomplete/autocomplete-display/autocomplete-display-example.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component} from '@angular/core';
 import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {Observable} from 'rxjs';
 import {map, startWith} from 'rxjs/operators';
@@ -27,12 +27,12 @@ export interface User {
     AsyncPipe,
   ],
 })
-export class AutocompleteDisplayExample implements OnInit {
+export class AutocompleteDisplayExample {
   myControl = new FormControl<string | User>('');
   options: User[] = [{name: 'Mary'}, {name: 'Shelley'}, {name: 'Igor'}];
   filteredOptions: Observable<User[]>;
 
-  ngOnInit() {
+  constructor() {
     this.filteredOptions = this.myControl.valueChanges.pipe(
       startWith(''),
       map(value => {
diff --git a/src/components-examples/material/autocomplete/autocomplete-filter/autocomplete-filter-example.ts b/src/components-examples/material/autocomplete/autocomplete-filter/autocomplete-filter-example.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component} from '@angular/core';
 import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {Observable} from 'rxjs';
 import {map, startWith} from 'rxjs/operators';
@@ -23,12 +23,12 @@ import {MatFormFieldModule} from '@angular/material/form-field';
     AsyncPipe,
   ],
 })
-export class AutocompleteFilterExample implements OnInit {
+export class AutocompleteFilterExample {
   myControl = new FormControl('');
   options: string[] = ['One', 'Two', 'Three'];
   filteredOptions: Observable<string[]>;
 
-  ngOnInit() {
+  constructor() {
     this.filteredOptions = this.myControl.valueChanges.pipe(
       startWith(''),
       map(value => this._filter(value || '')),
diff --git a/src/components-examples/material/autocomplete/autocomplete-optgroup/autocomplete-optgroup-example.ts b/src/components-examples/material/autocomplete/autocomplete-optgroup/autocomplete-optgroup-example.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit, inject} from '@angular/core';
+import {Component, inject} from '@angular/core';
 import {FormBuilder, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {Observable} from 'rxjs';
 import {startWith, map} from 'rxjs/operators';
@@ -33,7 +33,7 @@ export const _filter = (opt: string[], value: string): string[] => {
     AsyncPipe,
   ],
 })
-export class AutocompleteOptgroupExample implements OnInit {
+export class AutocompleteOptgroupExample {
   private _formBuilder = inject(FormBuilder);
 
   stateForm = this._formBuilder.group({
@@ -139,7 +139,7 @@ export class AutocompleteOptgroupExample implements OnInit {
 
   stateGroupOptions: Observable<StateGroup[]>;
 
-  ngOnInit() {
+  constructor() {
     this.stateGroupOptions = this.stateForm.get('stateGroup')!.valueChanges.pipe(
       startWith(''),
       map(value => this._filterGroup(value || '')),
diff --git a/src/components-examples/material/autocomplete/autocomplete-plain-input/autocomplete-plain-input-example.ts b/src/components-examples/material/autocomplete/autocomplete-plain-input/autocomplete-plain-input-example.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component} from '@angular/core';
 import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {Observable} from 'rxjs';
 import {startWith, map} from 'rxjs/operators';
@@ -14,12 +14,12 @@ import {MatAutocompleteModule} from '@angular/material/autocomplete';
   styleUrl: 'autocomplete-plain-input-example.css',
   imports: [FormsModule, MatAutocompleteModule, ReactiveFormsModule, AsyncPipe],
 })
-export class AutocompletePlainInputExample implements OnInit {
+export class AutocompletePlainInputExample {
   control = new FormControl('');
   streets: string[] = ['Champs-Élysées', 'Lombard Street', 'Abbey Road', 'Fifth Avenue'];
   filteredStreets: Observable<string[]>;
 
-  ngOnInit() {
+  constructor() {
     this.filteredStreets = this.control.valueChanges.pipe(
       startWith(''),
       map(value => this._filter(value || '')),
diff --git a/src/components-examples/material/autocomplete/autocomplete-require-selection/autocomplete-require-selection-example.ts b/src/components-examples/material/autocomplete/autocomplete-require-selection/autocomplete-require-selection-example.ts
@@ -20,14 +20,10 @@ import {MatFormFieldModule} from '@angular/material/form-field';
   ],
 })
 export class AutocompleteRequireSelectionExample {
-  @ViewChild('input') input: ElementRef<HTMLInputElement>;
+  @ViewChild('input') input!: ElementRef<HTMLInputElement>;
   myControl = new FormControl('');
   options: string[] = ['One', 'Two', 'Three', 'Four', 'Five'];
-  filteredOptions: string[];
-
-  constructor() {
-    this.filteredOptions = this.options.slice();
-  }
+  filteredOptions: string[] = this.options.slice();
 
   filter(): void {
     const filterValue = this.input.nativeElement.value.toLowerCase();
diff --git a/src/components-examples/material/bottom-sheet/bottom-sheet-harness/bottom-sheet-harness-example.ts b/src/components-examples/material/bottom-sheet/bottom-sheet-harness/bottom-sheet-harness-example.ts
@@ -16,7 +16,7 @@ import {
 export class BottomSheetHarnessExample {
   readonly bottomSheet = inject(MatBottomSheet);
 
-  @ViewChild(TemplateRef) template: TemplateRef<any>;
+  @ViewChild(TemplateRef) template!: TemplateRef<any>;
 
   open(config?: MatBottomSheetConfig) {
     return this.bottomSheet.open(this.template, config);
diff --git a/src/components-examples/material/core/ripple-overview/ripple-overview-example.ts b/src/components-examples/material/core/ripple-overview/ripple-overview-example.ts
@@ -19,6 +19,6 @@ export class RippleOverviewExample {
   disabled = false;
   unbounded = false;
 
-  radius: number;
-  color: string;
+  radius!: number;
+  color!: string;
 }
diff --git a/src/components-examples/material/paginator/paginator-configurable/paginator-configurable-example.ts b/src/components-examples/material/paginator/paginator-configurable/paginator-configurable-example.ts
@@ -33,7 +33,7 @@ export class PaginatorConfigurableExample {
   showFirstLastButtons = true;
   disabled = false;
 
-  pageEvent: PageEvent;
+  pageEvent: PageEvent | undefined;
 
   handlePageEvent(e: PageEvent) {
     this.pageEvent = e;
diff --git a/src/components-examples/material/radio/radio-ng-model/radio-ng-model-example.ts b/src/components-examples/material/radio/radio-ng-model/radio-ng-model-example.ts
@@ -12,6 +12,6 @@ import {MatRadioModule} from '@angular/material/radio';
   imports: [MatRadioModule, FormsModule],
 })
 export class RadioNgModelExample {
-  favoriteSeason: string;
+  favoriteSeason = '';
   seasons: string[] = ['Winter', 'Spring', 'Summer', 'Autumn'];
 }
diff --git a/src/components-examples/material/select/select-form/select-form-example.ts b/src/components-examples/material/select/select-form/select-form-example.ts
@@ -23,8 +23,8 @@ interface Car {
   imports: [FormsModule, MatFormFieldModule, MatSelectModule, MatInputModule],
 })
 export class SelectFormExample {
-  selectedValue: string;
-  selectedCar: string;
+  selectedValue!: string;
+  selectedCar = '';
 
   foods: Food[] = [
     {value: 'steak-0', viewValue: 'Steak'},
diff --git a/src/components-examples/material/sidenav/sidenav-disable-close/sidenav-disable-close-example.ts b/src/components-examples/material/sidenav/sidenav-disable-close/sidenav-disable-close-example.ts
@@ -10,7 +10,7 @@ import {MatButtonModule} from '@angular/material/button';
   imports: [MatSidenavModule, MatButtonModule],
 })
 export class SidenavDisableCloseExample {
-  @ViewChild('sidenav') sidenav: MatSidenav;
+  @ViewChild('sidenav') sidenav!: MatSidenav;
 
   reason = '';
 
diff --git a/src/components-examples/material/sidenav/sidenav-open-close/sidenav-open-close-example.ts b/src/components-examples/material/sidenav/sidenav-open-close/sidenav-open-close-example.ts
@@ -13,7 +13,7 @@ import {MatSidenavModule} from '@angular/material/sidenav';
 })
 export class SidenavOpenCloseExample {
   events: string[] = [];
-  opened: boolean;
+  opened = false;
 
   shouldRun = /(^|.)(stackblitz|webcontainer).(io|com)$/.test(window.location.host);
 }
diff --git a/src/components-examples/material/sort/sort-overview/sort-overview-example.ts b/src/components-examples/material/sort/sort-overview/sort-overview-example.ts
@@ -27,11 +27,7 @@ export class SortOverviewExample {
     {name: 'Gingerbread', calories: 356, fat: 16, carbs: 49, protein: 4},
   ];
 
-  sortedData: Dessert[];
-
-  constructor() {
-    this.sortedData = this.desserts.slice();
-  }
+  sortedData = this.desserts.slice();
 
   sortData(sort: Sort) {
     const data = this.desserts.slice();
diff --git a/src/components-examples/material/stepper/stepper-intl/stepper-intl-example.ts b/src/components-examples/material/stepper/stepper-intl/stepper-intl-example.ts
@@ -34,7 +34,7 @@ export class StepperIntlExample {
   private _formBuilder = inject(FormBuilder);
   private _matStepperIntl = inject(MatStepperIntl);
 
-  optionalLabelText: string;
+  optionalLabelText = '';
   optionalLabelTextChoices: string[] = ['Option 1', 'Option 2', 'Option 3'];
   firstFormGroup = this._formBuilder.group({
     firstCtrl: ['', Validators.required],
diff --git a/src/components-examples/material/table/table-dynamic-array-data/table-dynamic-array-data-example.ts b/src/components-examples/material/table/table-dynamic-array-data/table-dynamic-array-data-example.ts
@@ -35,7 +35,7 @@ export class TableDynamicArrayDataExample {
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
   dataSource = [...ELEMENT_DATA];
 
-  @ViewChild(MatTable) table: MatTable<PeriodicElement>;
+  @ViewChild(MatTable) table!: MatTable<PeriodicElement>;
 
   addData() {
     const randomElementIndex = Math.floor(Math.random() * ELEMENT_DATA.length);
diff --git a/src/components-examples/material/table/table-expandable-rows/table-expandable-rows-example.ts b/src/components-examples/material/table/table-expandable-rows/table-expandable-rows-example.ts
@@ -16,7 +16,7 @@ export class TableExpandableRowsExample {
   dataSource = ELEMENT_DATA;
   columnsToDisplay = ['name', 'weight', 'symbol', 'position'];
   columnsToDisplayWithExpand = [...this.columnsToDisplay, 'expand'];
-  expandedElement: PeriodicElement | null;
+  expandedElement: PeriodicElement | null = null;
 
   /** Checks whether an element is expanded. */
   isExpanded(element: PeriodicElement) {
diff --git a/src/components-examples/material/table/table-http/table-http-example.ts b/src/components-examples/material/table/table-http/table-http-example.ts
diff --git a/src/components-examples/material/table/table-overview/table-overview-example.ts b/src/components-examples/material/table/table-overview/table-overview-example.ts
diff --git a/src/components-examples/material/table/table-pagination/table-pagination-example.ts b/src/components-examples/material/table/table-pagination/table-pagination-example.ts
diff --git a/src/components-examples/material/table/table-sorting/table-sorting-example.ts b/src/components-examples/material/table/table-sorting/table-sorting-example.ts
diff --git a/src/components-examples/material/table/table-text-column-advanced/table-text-column-advanced-example.ts b/src/components-examples/material/table/table-text-column-advanced/table-text-column-advanced-example.ts
diff --git a/src/components-examples/material/table/table-wrapped/table-wrapped-example.ts b/src/components-examples/material/table/table-wrapped/table-wrapped-example.ts
diff --git a/src/components-examples/material/timepicker/timepicker-datepicker-integration/timepicker-datepicker-integration-example.ts b/src/components-examples/material/timepicker/timepicker-datepicker-integration/timepicker-datepicker-integration-example.ts
diff --git a/src/components-examples/tsconfig.json b/src/components-examples/tsconfig.json

Original file line number	Diff line number	Diff line change
`@@ -12,6 +12,6 @@ import {MatFormFieldModule} from '@angular/material/form-field';`
`12`	`12`	`imports: [MatFormFieldModule, MatInputModule, TextFieldModule, MatButtonModule],`
`13`	`13`	`})`
`14`	`14`	`export class TextFieldAutofillDirectiveExample {`
`15`		`- firstNameAutofilled: boolean;`
`16`		`- lastNameAutofilled: boolean;`
	`15`	`+ firstNameAutofilled = false;`
	`16`	`+ lastNameAutofilled = false;`
`17`	`17`	`}`