Question

以下是与AngualarJS数据绑定的下拉列表：

   <select name="lineCode" class="form-control input-sm"
        ng-model="monitoringProbe.tdmCapture.selectedTDMCard.layer1Properties.lineCode"
        ng-options="l.id as l.name for l in monitoringProbeTDMCaptureData.lineCodes"
                    required >
   </select>

我按如下方式填写ng-options：

 virtualServerMonitoringProbeService.comboProperties().query({},{itemType:1, interfaceType: interfaceType}).$promise.then(
            function(result){
                monitoringProbeTDMCaptureData.lineCodes = result;
            },
            function(error){
                messageNotificationFactory.setNotification('error', error.data.message);
            }
        );

根据以下帖子，当ng-model中没有值与下拉列表中的项目匹配时。 Why does AngularJS include an empty option in select?

因此，我强制列表中的第一个元素为选定值，如下所示：

     virtualServerMonitoringProbeService.comboProperties().query({},{itemType:1, interfaceType: interfaceType}).$promise.then(
            function(result){
                monitoringProbeTDMCaptureData.lineCodes = result;
                tdmCapture.selectedTDMCard.layer1Properties.lineCode = monitoringProbeTDMCaptureData.lineCodes[0];
            },
            function(error){
                messageNotificationFactory.setNotification('error', error.data.message);
            }
        );

但是下拉选择仍然是空的。在运行时这是它的样子：

<select name="lineCode" class="form-control input-sm ng-pristine ng-valid ng-valid-required" ng-model="monitoringProbe.tdmCapture.selectedTDMCard.layer1Properties.lineCode" ng-options="l.id as l.name for l in monitoringProbeTDMCaptureData.lineCodes" required="">
   <option value="?" selected="selected"></option>
   <option value="0">AMI</option>
    <option value="1">B8ZS</option>
</select>

此代码有什么问题吗？

Answer 1

由于您在ngoption select中使用语法“label作为value array ng-options="l.id as l.name for l in monitoringProbeTDMCaptureData.lineCodes" tdmCapture.selectedTDMCard.layer1Properties.lineCode = monitoringProbeTDMCaptureData.lineCodes[0];需要你的ng-model来保存所选项目的id以进行默认选择。但似乎您正在设置对象ngModel。

尝试更改： -

 tdmCapture.selectedTDMCard.layer1Properties.lineCode = 
                    monitoringProbeTDMCaptureData.lineCodes[0].id;

到

monitoringProbe

您可能还缺少模型中的{{1}}吗？

角度数据绑定<select>为空</select>

1 个答案: