Wie set radio-button-Wert mittels Reaktiver form?

Hier ist meine Komponente Klasse, wo ich versuche ein Formular radio button "den Wert" 1:

import { FormGroup, FormControl } from '@angular/forms';

export class myComponent implements OnInit{
    pageForm: FormGroup;

    ngOnInit() {
        this.pageForm = new FormGroup({
            'gndr': new FormControl(1)
        });
    }
}

aber wenn die Seite geladen wird der Radio-button ist nicht auf Männliche und beide Optionen sind leer:

<div class="form-group">
    <label for="gender">Gender</label>
    <div class="radio">
        <label>
            <input type="radio" name="gndr" formControlName="gndr" value=1>Male
        </label>
    </div>
    <div class="radio">
        <label>
            <input type="radio" name="gndr" formControlName="gndr" value=0>Female
        </label>
    </div>
</div>

also, wie kann ich laden Sie die radio-button-Wert von meinem component-Klasse?

InformationsquelleAutor John Glabb | 2017-10-12

  1. 9

    Wenn Sie möchten, einer von Ihnen geprüft werden standardmäßig manuell, kann man die "checked" - tag z.B. 

    <div class="radio">
    <label>
        <input type="radio" name="gndr" formControlName="gndr" value=1 checked>Male
    </label>
</div>
<div class="radio">
    <label>
        <input type="radio" name="gndr" formControlName="gndr" value=0>Female
    </label>
</div>

    Bearbeiten

    Wenn Sie möchten, verwenden Sie den Standardwert von Typ string, in der FormControl:

    component.ts

    this.pageForm = new FormGroup({
      'gndr': new FormControl('1')
    });

    component.html

    ...
<input type="radio" formControlName="gndr" value=1>
...

    Wenn Sie möchten, verwenden Sie den Standardwert von Typ Anzahl, in der FormControl:

    component.ts

    this.pageForm = new FormGroup({
      'gndr': new FormControl(1)
    });

    component.html

    ...
<input type="radio" formControlName="gndr" [value]=1>
...
    ja aber wie muss ich es einstellen von der component-Klasse basiert auf FormControl: 'gndr': neues FormControl(1)... dachte ich, es sollte geprüft param. Es gibt keinen sence verwenden FormControl und fest in HTML
    Ah sorry, falsch verstanden, sollte diese Arbeit 'gndr': new FormControl('1')
    Nicht sicher, ob Sie möchten, dass der Wert vom Typ "string", wie Sie vorschlagen, in Ihrem html-Ansicht.. aber das nicht wirklich macht keinen Sinn, um den string-Typ von 1 und 0. Also, wenn Sie möchten, können Sie ändern Sie die template-syntax von value=1 und value=0 in Ihren Eingaben [value]=1 und [value]=0. Um sicherzustellen, dass die Werte vom Typ Zahl. Dann sollte es funktionieren mit Ihrem original ` 'gndr': neues FormControl(1)`
    es funktioniert Super.. Danke Andresson

    InformationsquelleAutor Andresson

Schreibe einen Kommentar