Begrip: Dependency Injection

Bepaalde klassen kunnen in Angular geïnjecteerd worden in een pagina, component of service. Op deze manier is een instantie van de klasse beschikbaar zonder dat deze expliciet geïnstantieerd moet worden. Het injecteren kan op twee manieren:

inject functie (Gebruik deze bij voorkeur)

import {Component, inject} from '@angular/core'
import {SomeInjectable} from 'foo'

@Component({
  selector: 'app-bar',
  templateUrl: 'bar.page.html',
  styleUrls: ['bar.page.scss'],
})
export class BarPage {
  #someInjectable = inject(SomeInjectable)
  // Voor een publieke variable  
  // someInjectable = inject(SomeInjectable)

  constructor() {
  }
}

constructor

import {Component, inject} from '@angular/core'
import {SomeInjectable} from 'foo'

@Component({
  selector: 'app-bar',
  templateUrl: 'bar.page.html',
  styleUrls: ['bar.page.scss'],
})
export class BarPage {
  constructor(private someInjectable: SomeInjectable) {}
  // Voor een publieke variabele
  // constructor(public someInjectable: SomeInjectable) {}
}

:::