20

angularjsでオプションAM、PMを使用してhtml選択を追加したいのですが、必要なのはオプションのキーと値を同じにすることです:

<option value="AM">AM</option>
<option value="PM">PM</option>

私のhtmlは次のようになります

<select ng-model="ampm" ng-options="k as v for (k , v) in ampms"></select>

私のコントローラーは次のようになります

  $scope.ampm = (new Date().getHours()) >= 12 ? 'PM' : 'AM';
  $scope.ampms ={"AM":"AM","PM":"PM"};

そしてすべてがうまくいっています。

私の質問は、配列を使用したときに同じことができない理由です（ng-optionsのすべてのオプションを試しました）

$scope.ampms =["AM","PM"];

私が何をしても、私はいつもこれを手に入れます

<option value="0">AM</option>
<option value="1">PM</option>

私が望むのは、上記のような配列をオプションで使用して、キーと値を同じにすることです。

4

3 に答える 3

26

AngularJS では、オプションの値が何であるかを気にする必要はありません。私が見たすべての選択は、ng-options値が 0 から何でもあります。2 つのオプションを含むドロップダウンを探しているだけの場合は、次のように簡単にできます。

<select ng-model="ampm" ng-options="currOption for currOption in ['AM', 'PM']"></select>

http://jsfiddle.net/EyBVN/1/を参照

于 2012-12-04T00:04:03.107 に答える
10

これは、Angular の ng-options のデフォルトの動作です。キー名を指定しない場合、angular はキーではなくインデックスを使用することを自動的に選択します。これを行うコードは、Angular の Github リポジトリ の /src/ng/directives/select.js の 405 行目にあります。

「値の（インデックス、値）の値としての値」によって強制することさえできません。

しかし、dnc253 は彼の答えで私を打ちのめしました (私が入力しているときに表示されました)...心配する必要はありません。Angular が自動的にすべてを行います。

于 2012-12-04T00:15:30.583 に答える
2

選択のオプションの値に特定のデータを配置する方法を見つけました。select タグ内の option タグに ng-repeat 属性を追加する必要があります。

<select id="{{question.id}}" name="{{question.id}}" 
    class="{{question.inputclass}}" ng-required="question.required" 
    title="{{question.title}}">
  <option value=""></option>
  <optgroup ng-repeat="group in question.data" label="{{group.group}}">
    <option ng-repeat="item in group.data" value="{{item.value}}" 
        ng-selected="{{item.value == question.defaultValue}}">
          {{item.description}}
    </option>
  </optgroup>
</select>

おまけとして、オプション グループのタグを残して、全員の例として使用できるようにしました。

はquestion.data JSON：

[
  {"group":"Canada","data":[{"value":"Ontario","description":"Toronto"},
                            {"value":"Quebec","description":"Quebec City"},
                            {"value":"Manitoba","description":"Winnipeg"}
                           ]
  },
  {"group":"Mexico","data":[{"value":"Jalisco","description":"Guadalajara"},
                            {"value":"Nayarit","description":"Tepic"}
                           ]
  },
  {"group":"United States of America","data":[
                            {"value":"Alabama","description":"Montgomery"},
                            {"value":"Georgia","description":"Atlanta"},
                            {"value":"Mississippi","description":"Jackson"},
                            {"value":"Louisiana","description":"Baton Rouge"},
                            {"value":"Texas","description":"Ausint"}
                           ]
  }
]
于 2014-01-17T01:19:54.693 に答える