ng-optionを使用してドロップダウン値を表示

Question

私のアプリケーションでは、スクロールダウンメニューのオプションを使用しています。これの代わりに、値がjsファイルから来るようにng-optionを使いたいと思います。私はこれのための角度jsコードの助けを必要とする。ここに私のHTMLコードとオプションの値があります。 documentationあなたが次のことを行うことができますに基づいて

<div class="form-group"> 
     <label class="control-label col-lg-2 pull-left">Quality<span class="Imp">*</span></label> 
      <div class="col-lg-8"> 
       <select id="Quality" name="Quality" class="form-control" style="width:170px" ng-model="vm.EditRef_UI.Quality" tooltip="Quality is required"                 tooltip-placement="top" required> 

        <option selected value="Satisfactory">Satisfactory</option> 
        <option value="NotSatisfactory">Not Satisfactory</option> 
       </select> 
      </div> 

Answer 1

<select ng-options="category.value as category.name for category in sourceValues" ng-model="Quality"></select> 

第一入力category.valueは、オプションの値になり、category.nameは、コントローラでは、ドロップダウンリスト

に示す値は、あなたが

を使用するオプションとその値を持つ配列を定義だろう

$scope.sourceValues = [ 
     {value: 'Satisfactory', name: 'Satisfactory'}, 
     {value: 'NotSatisfactory', name: 'Not satisfactory'} 

     ]; 

Answer 2

..いくつかの助けを必要としています。例えば

<select ng-options="item as item.label for item in qualities track by item.id" ng-model="Quality"></select> 

Answer 3

あなたはスコープの変数「資質」にあなたの品質オプションを埋めている場合：

$scope.qualities = [{id: 1, label: 'Low Quality'}, {id: 2, label: 'Medium Quality'}, {id: 3, label: 'High Quality'}]; 

あなたが好きなあなたのhtmlを更新することができます。

<div class="form-group"> 
     <label class="control-label col-lg-2 pull-left">Quality<span class="Imp">*</span></label> 
      <div class="col-lg-8"> 
       <select id="Quality" name="Quality" class="form-control" style="width:170px" ng-options="item as item.label for item in qualities track by item.id" ng-model="vm.EditRef_UI.Quality" tooltip="Quality is required"                 tooltip-placement="top" required> 
       </select> 
      </div> 

あなたが使用する必要があります次のような属性ng-options：

ng-options="item as item.label for item in qualities track by item.id" 

あなたの選択は依然としてスコープ変数vm.EditRef_UI.Qualityで更新されます。