使用 ng-option 时设置选定的标签

Question

我有这段代码可以通过 ng-option 将值加载到下拉列表中。但是当我使用 ng-option 时我无法设置默认值。请在这里找到我的代码并帮助我。

               <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="Q.value as Q.name for Q in vm.quality" ng-model="vm.Edit.Quality" tooltip="Quality is required"
                  tooltip-placement="top" required>

                             </select>
                        </div>
                  </div>

angular代码在这里：

 vm.quality = [{ value: 'Satisfactory', name: "Satisfactory" },
        { value: 'NotSatisfactory', name: "Not Satisfactory" }];
        vm.Edit.Quality = vm.quality[0];

我使用最后一行 vm.Edit.Quality = vm.quality[0]; 将所选（默认）值设置为无效的质量。

Answer 1

像这样尝试

var app = angular.module('anApp', []);
app.controller('aCtrl', function($scope) {
var vm = this;
   vm.quality = [{ value: 'Satisfactory', name: "Satisfactory" },
        { value: 'NotSatisfactory', name: "Not Satisfactory" }];
        vm.Quality = vm.quality[0].value;
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>

<div ng-app="anApp" ng-controller="aCtrl as vm">
 <div class="form-group">
     <label class="control-label col-lg-2 pull-left">Quality<span class="Imp">*</span></label>
     <div>
      <select ng-options="Q.value as Q.name for Q in vm.quality"
                   ng-model="vm.Quality">
      </select>
    </div>
  </div>
</div>

Answer 2

you can use ng-option this way:

<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="Q.value as Q.name for Q in vm.quality" ng-model="vm.Edit.Quality" tooltip="Quality is required"
              tooltip-placement="top" required>
      <option value="?" selected="selected"></option>
      <option value="0">Item 1</option>
      <option value="1">Item 2</option>
      <option value="2">Item 3</option>
    </select>
 </div>

使用 ng-option 时设置选定的标签

setting selected tag when ng-option is used

html

angularjs

select

ng-options

selected