web-dev-qa-db-de.com

AngularJS Checkbox ng-repeat und ausgewählte Objekte?

Ich versuche es auf die richtige Art und Weise mit weniger Schmerzen zu machen, aber ich kann nicht herausfinden, wie ich mit dem ng-Modell umgehen und es an die ausgewählte Liste usw. binden soll. Außerdem muss ich diese Liste zu einem späteren Zeitpunkt füllen und ausgewählte Objekte behalten drin.

categories = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ]

    <span ng-repeat="category in categories">
      <label class="checkbox" for="{{category.id}}">
        <input type="checkbox" value="{{category.id}}" ng-model="??" ng-click="??" name="group" id="{{category.id}}" />
        {{category.name}}
      </label>
    </span>

Ich muss die Kategorien jedes Mal überschreiben, wenn die Liste gefüllt wird, da sie von einem Server abgerufen wird.

Also muss ich wohl Arrays haben und das zweite wird die ausgewählten Objekte enthalten?

Wie kann ich Kontrollkästchen vorwählen, wenn ich recht habe?

Muss ich zum Aufrufen der benutzerdefinierten Funktion auf ng-click klicken, um das ausgewählte Objekt im anderen Array zu speichern?

Brauche ich ein ng-Modell in der Checkbox und wofür?

Was ist der richtige Weg mit weniger Schmerzen?

40
Jakub Kuchar

Ich muss die Kategorien jedes Mal überschreiben, wenn die Liste ausgefüllt wird, da es sich um einen Pull-Out-Form-Server handelt. Also muss ich Arrays haben und das zweite wird die ausgewählten Objekte halten?

Ja, da es sich um eine Liste handelt, können/sollten Sie Arrays verwenden. Die Informationen zu den ausgewählten Elementen/Objekten sollten in Ihrem Oszilloskopmodell gespeichert sein (Beispiel unten).

Wenn ich recht habe, wie kann ich Kontrollkästchen vorwählen?

Speichern Sie die IDs der ausgewählten Optionen/Kontrollkästchen auf Ihrem Modell und lassen Sie das ng-model mach den Rest.

Muss ich zum Aufrufen der benutzerdefinierten Funktion auf ng-click klicken, um das ausgewählte Objekt im anderen Array zu speichern?

Nein, du brauchst es nicht, ng-model ist genug.

Benötige ich das Kontrollkästchen ng-model in? Und wofür?

Ja, du brauchst es. Das ng-model ist dafür verantwortlich, die ausgewählten Optionen in Ihrem Modell zu speichern und die ('Vor -') Auswahl automatisch vorzunehmen.

jsfiddle http://jsfiddle.net/bmleite/PQvQ2/

70
bmleite