typescript - Hvordan deaktivere alle feltene i et malbasert skjema i Angular

Jeg laget et malbasert skjema i Angular 5

Jeg vil deaktivere hele skjemaet først, og jeg vil også at skjemaet skal aktiveres når en knapp blir klikket, derfor la jeg til en disabled-egenskap i form-taggen og satte verdien til false som vist nedenfor, (dette fungerte imidlertid ikke):

<form #formName = "ngForm" [disabled]="true">
</form>

Siden den ovennevnte deaktiverte egenskapen ikke fungerte, endret jeg den deaktiverte egenskapen til

[attr.disabled] = true

Dette fungerte heller ikke

Nå som jeg har referansen til formelementet som er #formName, brukte jeg den i TS-filen og prøvde å endre verdien til disabled-egenskapen inne i referanseobjektet

Her er hva jeg har gjort:

@ViewChild('formName') formName;


this.formName.disabled = true;

som heller ikke fungerte, og jeg fikk en feilmelding som sa at disabled ikke kan endres siden det kun er en getter

Hvordan bør jeg deaktivere hele skjemaet som standard i Angular på mal-drevne skjemaer?

Takk på forhånd :)

Svar #1

Som nevnt i kommentaren kan du pakke inn skjemaet i en fieldset-tag og oppnå dette som vist nedenfor:

<form>
    <fieldset [disabled]="fieldsetDisabled">
        <!-- YOUR FIELDS HERE -->
    </fieldset>
</form>

Og du kan håndtere tilstanden i kontrolleren din ved å veksle en lokal variabel mellom deaktivert/aktivert-tilstandene slik:

this.fieldsetDisabled = true;  // Disables the fieldset
this.fieldsetDisabled = false; // Enables the fieldset

Relaterte artikler