Lo stessa struttura del form mostrata nelle pubblicazioni precedenti, tipizzazione inclusa, può essere ricreata utilizzando la classe FormBuilder. Nel caso in cui volessimo disabilitare tutti i campi nulli, la stesura risulterà anche più pulita, in quanto sarà l'istanza iniettata, NonNullableFormBuilder, a creare i controlli adatti senza la necessità di specificarne l'opzione.
import { NonNullableFormBuilder } from '@angular/forms'; @Component({}) export class AppComponent { // form default profileForm = this.fb.group({ firstName: this.fb.nonNullable.control(""), lastName: '', address: this.fb.group({ street: '', city: '', }) }); // form non nullabile profileForm1 = this.fb1.group({ firstName: '', lastName: '', address: this.fb.group({ street: '', city: '', }) }); constructor(private fb: FormBuilder,private fb1: NonNullableFormBuilder) {} }
Nello snippet seguente troviamo un caso comune di definizione di un FormGroup, nel quale il form è definito all'interno dell'implementaizone dell'interfaccia OnInit. Benchè questa formulazione sia corretta, non permette all'intellisense di pre-analizzare il codice e fornire il corretto supporto allo sviluppatore. In questo caso qualsiasi valore venga richiesto sarà interpretato come tipo any.
export class AppComponent implements OnInit { profileForm:FormGroup; constructor(private fb: FormBuilder) {} ngOnInit(){ profileForm = this.fb.group({ firstName: '' lastName: '' }); // any const formValues = profileForm.value; // any const name = profileForm.value.firstName; // any const lastname = profileForm.value.lastName; } }
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Implementare il throttle in JavaScript
Introduzione ai web component HTML
Eseguire query in contemporanea con EF
Il nuovo controllo Range di Blazor 9
Effettuare il log delle chiamate a function di GPT in ASP.NET Web API
Utilizzare Locust con Azure Load Testing
Selettore CSS :has() e i suoi casi d'uso avanzati
Gestione dei nomi con le regole @layer in CSS
Popolare una classe a partire dal testo, con Semantic Kernel e ASP.NET Core Web API
Creare una libreria CSS universale: Clip-path
Creare una libreria CSS universale: Nav menu
Centralizzare gli endpoint AI Foundry con Azure API Management
I più letti di oggi
- Documentare i servizi REST con Swagger e OpenAPI con .NET 9
- Sfruttare i nuovi overload di TimeSpan.From* per creare timespan usando numeri interi
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!