AngularJS + UI Bootstrap Typeahead: preload-Wert vom Objekt-in das Eingabefeld

Ich versuche, mit AngularJS + UI Bootstrap Typeahead zu füllen, der im input-Feld mit dem name-Attribut eines Objekts, während ich das id-Attribut dieses Objekts, wenn das Formular gesendet wird.

Das problem ist, dass wenn ich versuche, laden Sie den Eingang mit einem zuvor gespeicherten Wert - der Wert des id-Attributs wird angezeigt, im Eingang anstelle des Werts des name-Attributs.

<input type="text" ng-model="form.product_id" typeahead="option.id as option.name for option in p.options | filter:$viewValue" />

jsFiddle

Wie kann ich die Vorspannung den Wert des name-Attribut und immer noch die gewünschte Funktionalität?

  • ur fiddle nicht arbeiten, obwohl
  • Ich sehe, dass es nicht im neuen builds von Chrome - es ist nicht das laden externer Skripte von github, da die strikte MIME-Typ-überprüfung wird aktiviert. Wenn Sie möchten, um mit ihm hantieren könnten Sie bitte Firefox verwenden?
  • aktualisiert code haben Sie einen Blick auf meine Antwort
  • Dieselbe Geige aber arbeiten: jsfiddle.net/hieuh25/CXnKD
InformationsquelleAutor honzzz | 2013-07-16
  1. 16

    Können Sie die product object als ng-model. Und dann können Sie einfach die id verwenden form.product.id.

    Demo auf jsFiddle

    <div ng-controller="MyTabCtrl"> <pre>Model: {{form.product.id | json}}</pre>
    <p>The goal is to show "Horay!" while the model is set to 1.</p>
        <input type="text" autocomplete="off" ng-model="form.product" typeahead="option as option.name for option in p.options | filter:$viewValue" />
    <p>Try to write "Audi".</p>
</div>
    InformationsquelleAutor zs2020
Schreibe einen Kommentar