2013-02-21 8 views
10

Ich arbeite an einer Angular-Anwendung.Angular.js: Zwei-Wege-Bindung innerhalb ng-Wiederholung

Ich möchte ein Formular mit einer beliebigen Anzahl von Texteingabefeldern mit Zwei-Wege-Bindungen für jedes einzelne Eingabefeld generieren. Keine Knöpfe, keine Beobachter. ng-model funktioniert wegen des Scoping nicht korrekt (wenn ich mich nicht irre). Die Eingabefelder werden von einem Array mit ng-Wiederholung wie folgt generiert:

<div ng-repeat="item in items"> 
    <label>{{item.name}}</label> 
    <input type="text" placeholder="{{item.default}}" ng-model="{{item.value}}"> <!-- this input should be bound --> 
</div> 

ich Bindung aktualisieren, um die items Array in der Steuerung auf Änderungen der Eingangs nur eine einfache wollen.

Jede Hilfe wird geschätzt.

+2

Sie brauchen nur Winkel Klammern {{var}}, wenn Sie es aus auf die Seite gerade schreiben. Wenn Sie es in Wiederholungen oder Modellen oder Filtern verwenden, brauchen Sie die Klammern nicht. Beachte, dass du dies bereits in der ng-Wiederholung machst, du hast "item in {{items}}" nicht gemacht. –

+0

Danke für den Rat James! Ich glaube, ich habe Angular ein bisschen besser verstanden (ich bin aber noch neu dazu :)) –

Antwort

11

Nur Input-Tag ändern, so heißt es:

<input type="text" placeholder="{{item.default}}" ng-model="item.value"> 

Hinweis ng-model ohne geschweifte Klammern.

Arbeiten zupfen: http://plnkr.co/edit/CLdem9yIw2Sk1U52Iajl?p=preview

+0

Vielen Dank! Es funktioniert jetzt :) –

+2

dieser PLNKR funktioniert nicht. Ich sehe deutlich, dass der Schnurrbartwert {{item.name}} nicht aktualisiert wird. – FlavorScape