Winkel-4 Einstellung der ausgewählten option im Dropdown

dazu ein paar Fragen und verschiedene Antworten. Aber keiner von Ihnen wirklich Antworten auf die Frage. Also nochmal:

Standard-Einstellung von einer Dropdown-wählen Sie von Wert nicht funktioniert in meinem Fall. warum?
Dies ist von der dynamischen Form tutorial von Winkel-4:

<select [id]="question.key" [formControlName]="question.key">
      <option *ngFor="let opt of question.options" [value]="opt.key" [selected]="opt.selected">{{opt.selected+opt.value}}</option>
</select>

Es nicht wählen Sie alles, was. Folgende Optionen sind verfügbar:

  • trueaaa
  • falsebbb
  • falseccc

Aber statisch wahr:

<option ... [selected]="true">...</option>

wählt den letzten Wert (alles wahr).
Es funktioniert auch mit einer privaten variable boolvar = true und in [selected]="boolvar"

Ich verstehe nicht den Unterschied zwischen der "opt" - Objekt und die Klasse variable??

versuchen..... [selected]="opt.ausgewählt?true:false">
hey Gregor, Bitte versuchen Sie [Auswahl]="opt.selected == true" seine Arbeit für mich.
! Heilige **** ! Es funktioniert! 😀 Danke... schade dass ich immer noch nicht verstehen, was passiert unter der Haube.

InformationsquelleAutor Gregor Sklorz | 2017-09-01

  1. 9

    Wenn Sie möchten, wählen Sie einen Wert basierend auf true /false verwenden

    [selected]="opt.selected == true"

     <option *ngFor="let opt of question.options" [value]="opt.key" [selected]="opt.selected == true">{{opt.selected+opt.value}}</option>

    checkit out

    Eckige 2 - Einstellung gewählte Wert auf die dropdown-Liste

    Gut... das funktioniert für mich. Auch wenn seine schmutzig. Solange ich nicht verstehe, was passiert unter der Haube, das ist die beste Lösung für mich. Deine

    InformationsquelleAutor Vijay ijardar

  2. 7

    Hier ist mein Beispiel:

    <div class="form-group">
    <label for="contactMethod">Contact method</label>
    <select 
        name="contactMethod" 
        id="contactMethod" 
        class="form-control"
        [(ngModel)]="contact.contactMethod">
        <option *ngFor="let method of contactMethods" [value]="method.id">{{ method.label }}</option>
    </select>
</div>

    - Und in-Komponente müssen Sie die Werte aus wählen Sie:

    contactMethods = [
    { id: 1, label: "Email" },
    { id: 2, label: "Phone" }
]

    Also, wenn Sie wollen, wählen Sie, um ein Standard-Wert ausgewählt (und proabbly Sie wollen, dass):

    contact = {
    firstName: "CFR",
    comment: "No comment",
    subscribe: true,
    contactMethod: 2 //this id you'll send and get from backend
}
    Mit [(ngModel)] ist der richtige Weg, dies zu tun.

    InformationsquelleAutor Carnaru Valentin

  3. 4

    Wenn Sie möchten, wählen Sie einen Wert als Standardwert im Formular-generator geben Sie einen Wert ein : 

    this.myForm = this.FB.group({
    mySelect: [this.options[0].key, [/* Validators here */]]
});

    Nun in Ihrem HTML : 

    <form [formGroup]="myForm">
    <select [formControlName]="mySelect">
        <option *ngFor="let opt of options" [value]="opt.key">ANY TEXT YOU WANT HERE</option>
    </select>
</form>

    Was mein code tut, ist geben Sie Ihr einen Wert auswählen, der gleich dem ersten Wert der Optionen-Liste. Dies ist, wie Sie wählen Sie eine option als Standardwert in Eckigen, ausgewählt ist nutzlos.

    InformationsquelleAutor trichetriche

  4. 0

    Löschen [ausgewählt] von der option tag:

    <option *ngFor="let opt of question.options" [value]="opt.key">
  {{opt.selected+opt.value}}
</option>

    Und in Ihrer form builder hinzufügen:

    key: this.question.options.filter(val => val.selected === true).map(data => data.key)

    InformationsquelleAutor porgo

Schreibe einen Kommentar