Question

我需要选择从我的数据库获得的值。在html中检查时，我看到<option>之一的值更改为：selected="selected"，但是在选择中并没有真正选择它。

这是我的代码：

<select chosen class="form-control" name="state" ng-model="product.state" ng-change="updateData()" placeholder-text-single="'Select one'" required >
    <option value="">Select one</option>
    <option ng-repeat='i in statesList' value="{{i.id}}" ng-selected="i.id == product.state.id">{{i.name}}</option>
</select>

我尝试将ng-model的值更改为ng-model="product.state.id"，并且它可以正常工作，但仍处于选中状态，但是当然，以后不会保存数据。

statesList是从mongodb数据库集合中检索到的对象数组。

我已经阅读了其他类似的问题，但无法解决它们的问题。我是新手，对我来说有很多复杂的问题。有什么解决方案？我该如何解决？

Answer 1

无需ng-change处理程序。通过使用ng-options尝试以下方法。该模型将始终具有最新选择的值。

<select name="state" id="state"
  ng-options="option.name for option in statesList track by option.id"
  ng-model="product.state"></select>

Answer 2

在我的项目中，我已经使用Reactive表单处理了选择控件，您可以尝试这样

this.testForm = this.formBuilder.group({
      "testselectControl": []});

以html

  <select id="test1" formControlName="testselectControl"
        class="form-control p-0 start-date-input-box ">
        <option *ngFor="let val of listValues" [value]="val.id">
          {{name.name}}</option>
      </select>

当您收到这样的数据集值

 this.testForm .get("testselectControl").setValue(listValues ? (listValues.find((value) => (value.id.trim() ==selectedValueId) : "0");

Answer 3

 <select multiple ui-select2="{allowClear: true}" ng- 
 model="selectedCountries" data-placeholder="Countries">
 <option ng-repeat="country in countries" value="{{country.id}}"> 
 {{country.name}}</option>
 </select>
 <button ng-click="fetch()" class="btn btn-primary pull-right">Apply</button>

添加优先级的解决方案有效

ng-selected不起作用，但将选项修改为selected =“ selected”，与ng-repeat一起使用

3 个答案: