Da buono a ottimo: input richiesti in Angular

Mar 25 2023
Una nuova funzionalità introdotta in Angular 16.0.

Una nuova funzionalità introdotta in Angular 16.0.0-next.4 è la possibilità di definire inputscome richiesto componenti e direttive. In altre parole, ora possiamo specificare che un componente o una direttiva richiede determinati inputsper funzionare correttamente.

Utilizzando questa nuova funzionalità, possiamo garantire che tutti i dati necessari siano presenti prima che la logica del componente o della direttiva venga eseguita, con conseguente migliore qualità del codice, meno errori e un processo di sviluppo complessivamente più efficiente. Per usarlo possiamo impostare la nuova requiredopzione nel nostro input:

@Component({
  selector: 'app-foo',
  standalone: true,
  templateUrl: './foo.component.html',
})
export class FooComponent {
           
  @Input({ required: true }) elementId: string;
}

Possiamo anche passare un aliasutilizzando la nuova opzione alias:

@Component({
  selector: 'app-foo',
  standalone: true,
  templateUrl: './foo.component.html',
})
export class FooComponent {
           
  @Input({ required: true, alias: 'elementId' }) id: string;
}

      
                

Seguimi su Medium o Twitter per saperne di più su Angular e JS!