wählen verwende ich ein Beispiel aus Angular Dokumentation: https://docs.angularjs.org/api/ng/directive/select
„Verwendung ngValue das Modell zu einer Anordnung von Objekten zu binden, " Sektion.„[object Object]“ anstelle von Objekt übergeben wird für <select> bis ng-Modell, wenn ich eine Option mit Object
index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-select-ngvalue-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="ngvalueSelect">
<div ng-controller="ExampleController">
<form name="myForm">
<label for="ngvalueselect"> ngvalue select: </label>
<select size="6" name="ngvalueselect" ng-model="data.model" multiple>
<option ng-repeat="option in data.availableOptions" ng-value="option.value">{{option.name}}</option>
</select>
</form>
<hr>
<pre>model = {{data.model | json}}</pre><br/>
</div>
</body>
</html>
app.js:
(function(angular) {
'use strict';
angular.module('ngvalueSelect', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.data = {
model: null,
availableOptions: [
{value: 'myString', name: 'string'},
{value: 1, name: 'integer'},
{value: true, name: 'boolean'},
{value: null, name: 'null'},
{value: {prop: 'value'}, name: 'object'},
{value: ['a'], name: 'array'}
]
};
}]);
})(window.angular);
Plunker: https://plnkr.co/edit/aHgqeK1pQHS5zfiIjyZv?p=preview
Das Problem: Jeder <option> Objekt darstellt. Ich wähle ein Objekt und "[Object Object]" wird dem ng-Modell von <select> anstelle von object zugewiesen.
Angular empfiehlt, ng-Optionen anstelle von Repeater mit Optionen zu verwenden, aber ich muss einige zusätzliche Logik für jede Option wie ng-style verwenden (unterschiedlich für jede Option).
Die Frage ist: Wie Objekt als Objekt anstelle von String in ng-Modell von <select> übergeben werden, wenn Benutzer eine Option aus auswählen.
Es ist eigentlich ziemlich interessant, da die Standard-Plunker von Angular docs Seite nicht funktioniert, aber wenn Sie script src dem einen, verwendet auf docs Seite ändern (https : //docs.angularjs.org/angular.min.js), es funktioniert perfekt. – table
Sie haben Recht. Es sieht so aus, als ob sie eine unterschiedliche eckige Version in Dokumenten verwenden, verglichen mit dem, was sie für die Verteilung veröffentlichen. –
Es ist ziemlich interessant: Die letzte veröffentlichte eckige '1.x' Version ist' v1.5.8', aber für eckige Dokumente 'v1.5.9-build.5079 + sa.eeb9ef0' wird verwendet. –