AngularJS input select with integer value in ng-model stop working

Question

我有一个使用 WebApi 和 AngularJS.

用 C# .NET 编写的应用程序

在我的应用程序中的某些时候，我使用 ENUMS 填充了带有选项的 select 标签，因为由于值不在数据库中，我觉得不需要创建一个服务 return 枚举，因为我正在使用 razor 页面，所以我可以直接使用枚举。

一切正常，直到我将 angular 版本更新到 1.4.7，然后停止工作，我无法降级 angular 版本（出于某些企业原因）。

比如我有这个代码

<div class="col-md-3 col-xs-12">
    <label for="qualificacaoCobreJunta" class="col-xs-12 control-label">@IsiCTB.Internationalization.Res.Controls.label_cobre_junta<span class="obrigatorio">*</span></label>
    <div class="col-xs-12">
        <select class="form-control" id="qualificacao-cobre-junta" name="qualificacaoCobreJunta" ng-model="qualificacao.cobrejunta"
                required>
            <option value="" id="cobrejunta-0">@IsiCTB.Internationalization.Res.Controls.label_prompt_selecione</option>
            <option id="optCobreJuntaCom" value="@IsiCTB.Entities.Enums.ComSem.Com.ToInt()">@IsiCTB.Entities.Enums.ComSem.Com.GetValueString()</option>
            <option id="optCobreJuntaSem" value="@IsiCTB.Entities.Enums.ComSem.Sem.ToInt()">@IsiCTB.Entities.Enums.ComSem.Sem.GetValueString()</option>
            <option id="optCobreJuntaAmbos" value="@IsiCTB.Entities.Enums.ComSem.Ambos.ToInt()">@IsiCTB.Entities.Enums.ComSem.Ambos.GetValueString()</option>
            <option id="optCobreJuntaNA" value="@IsiCTB.Entities.Enums.ComSem.NA.ToInt()">@IsiCTB.Entities.Enums.ComSem.NA.GetValueString()</option>
        </select>
        <div ng-show="formQualificacaoSubmitted" class="error-form-validation">
            <div ng-show="gerenciaQualificacoesSoldador.qualificacaoCobreJunta.$error.required">@IsiCTB.Internationalization.Res.Controls.label_obrigatorio</div>
        </div>
    </div>
</div>

从 WebApi 获取数据的代码。

QualificacaoService.get({ id: idQualificacao }, function (data) {
    $scope.qualificacao = data;
});

还有那个 return 一个 JSON 具有一堆属性的对象，比如：

{
  id: 1,
  cobrejunta: 2,
  anotherEnumField: 1,
  anotherEnumField2: 5,
  anotherEnumField3: 2
  ....
}

如果我在模型中设置了 qualificacao.cobrejunta = "2"（字符串），则 select 指向正确的选项，但是如果我有 qualificacao.cobrejunta = 2 （整数）似乎没有任何作用。

有办法让它再次工作，或者唯一（最好）的解决方案是创建一个请求 API 的服务，这个 API 将构建数组而不是 return 使用 ng-option?

谢谢大家。

Answer 1

讨论here。

您所要做的就是如下更改您的select

<select class="form-control" id="qualificacao-cobre-junta" name="qualificacaoCobreJunta" ng-model="qualificacao.cobrejunta" required
    ng-options="entry.value as entry.label for entry in [{value : @IsiCTB.Entities.Enums.ComSem.Com.ToInt(), label: '@IsiCTB.Entities.Enums.ComSem.Com.GetValueString()'}, {value: @IsiCTB.Entities.Enums.ComSem.Sem.ToInt(), label: '@IsiCTB.Entities.Enums.ComSem.Sem.GetValueString()'}, {value: @IsiCTB.Entities.Enums.ComSem.Ambos.ToInt(), label: '@IsiCTB.Entities.Enums.ComSem.Ambos.GetValueString()'}, {value:@IsiCTB.Entities.Enums.ComSem.NA.ToInt(), label: '@IsiCTB.Entities.Enums.ComSem.NA.GetValueString()'}]">
</select>

Answer 2

我认为 Angular 行为在版本 1.4.8 中发生了变化。我遇到了同样的问题：我将值列表组合成一个组合（静态值），然后通过控制器将值动态分配给 select。这不是版本 1.3.8 的问题，但是当 selected 值保持空白时，它是 1.4.8 的问题。但是我可以在视图中显示值，而且是正确的。

为我解决这个问题的方法是将静态值转换为包含该值的对象，并在控制器的开头定义它（在分配值之前）。不得不这样做很奇怪，但我没有找到另一种成功的方法。

AngularJS input select with integer value in ng-model stop working

AngularJS input select with integer value in ng-model stop working

javascript

c#

angularjs

angularjs-ng-model

angularjs-select