5

私は現在、単純なように見える問題に悩まされています:

コントローラー：

$scope.fruits = [{
    name: 'AP',
    label: 'Apple'
  }, {
    name: 'BA',
    label: 'Bananas'
  }];

HTML コード :

<select
    ng-model="meal.fruit"
    ng-options="fruit.name as fruit.label for fruit in fruits">
</select>

<p>Fruit : {{meal.fruit}}</p>

問題は、これが表示されることです

Fruit : BA

それ以外の

Fruit : Bananas

モデル「meal.fruit」を「AP」または「BA」にする必要があるため、ng-option を「fruit as fruit.label」に変更することはできません (Jackson によって逆シリアル化された Java 列挙型であり、列挙値)。

JSFiddle

要約すると、meal.fruit を「BA」にする必要があり、選択した値「Bananas」を別の場所に表示できるようにしたいと考えています。

私に何ができる ？

編集 ：

私のために働いた解決策は、Maxim Shoustinによって発見されました(どうもありがとう!):

次のようにコードを変更しました。

http://jsfiddle.net/2qfSB/77/

次に、submit メソッドを変更して、以下を追加しました。

$scope.meal.fruit = $scope.meal.fruit.name;
4

1 に答える 1

3

変更するだけng-optionsです：

ng-options="fruit.label as fruit.label for fruit in fruits">

固定デモ:Fiddle

補足として

次を使用して、デフォルトで最初の要素を設定して、空のコンボを回避できますng-init。

<select
        ng-model="meal.fruit"
        ng-options="fruit.label as fruit.label for fruit in fruits"
        ng-init="meal.fruit = fruits[0].label"
    >

デモ：Fiddle

于 2013-10-30T16:03:23.820 に答える