Question

我对select标记有问题，该标记填充了WCF-Service中的一些数据。当我点击选择框时它不会打开（见下图），但是当我用键盘箭头导航时，我可以选择我的数据。另一件令人伤心的事情是：它不会经常发生。有时它会发生，有时不会发生。

点击选择框后会发生这种情况：

Select box

到目前为止，数据已从服务中加载。

下面显示的两个选择框的概念：在第一个选择框（ name =“kind”）中选择内容后，第二个应该出现。即使出现错误，我也能完美地工作，我只能用键盘选择数据。但如果错误在第一个选择框中，它也在第二个。

设置： IE 11，AngularJS v1.5.5，Bootstrap v3.3.5在FF或Chrome中没有发生

$ agronomicservice.kindsoftasks.kindsoftasks 的数据结构

这是对象列表
对象： [{Id：1，姓名：“somename”}，{Id：2，姓名：“somename2”}]

HTML码

<table class="tablePadding">
    <thead></thead>
    <tbody>
        <tr>
            <td class="taskagronomicsFontSize">{{i18n.sometranslation1}}:</td>
            <td>
                <select name="kind"
                    ng-options="label.Id as label.Name for label in $agronomicservice.kindsoftasks.kindsoftasks"
                    ng-model="$taskservice.currentTask.kindoftask"
                    ng-change="setKindOfTaskinPath()"
                    ng-disabled="isExistingTask || taskFinished"
                    class="form-control"
                    style="width: 200px;">
                </select>
            </td>
        </tr>
        <tr ng-hide="$taskservice.currentTask.kindoftask == null">
            <td ng-hide="$taskservice.currentTask.kindoftask == enums.KINDOFTASK.pp" class="taskagronomicsFontSize">{{i18n.sometranslation2}}:</td>
            <td ng-show="$taskservice.currentTask.kindoftask == enums.KINDOFTASK.pp" class="taskagronomicsFontSize">{{i18n.sometranslation3}}:</td>
            <td>
                <select name="application"
                    ng-options="option.Id as option.Name for option in $agronomicservice.applications.applications | acApplicationFilter:$taskservice.currentTask.kindoftask"
                    ng-model="$taskservice.currentTask.application"
                    ng-change="setApplicationinPath()"
                    ng-disabled="isExistingTask || taskFinished"
                    class="form-control"
                    style="width: 200px;">
                </select>
            </td>
        </tr>
     </body>
 </table>

JS-Code的摘录

var promiseKOT = $scope.$taskservice.updateKindsoftasks();
promiseKOT.then(
   function(newKindsoftasks) {
       $scope.$agronomicservice.kindsoftasks = newKindsoftasks;
   });

var updateKindsoftasks = function(){
    var promise = $http.post(__serverURL__+'/GetData?' + new Date().getTime(),
        4,
        {
            headers : {
                'SessionHash': __SessionHash__,
                'Access-Control-Request-Methods': 'GET, POST',
            },
            timeout : 600000,
            cache : false,
            responseType : 'json'
        }
    )
    .then(function(response) {
        return {kindsoftasks: response.data};
    },
    function(errorPayload) {
       //Some error handling
    });

    return promise;
};

CSS

.form-control {
   font-size: 14px;
   border-radius: 0px;
   font-family: Verdana;
}

.form-control:hover {
   outline: none !important;
   box-shadow: none !important;
}

.tablePadding > tbody > tr > td {
   padding-top: 10px;
   padding-left: 1px;
   padding-right: 1px;
   padding-bottom: 10px;
}

.tablePadding > thead > tr > th {
   padding-top: 5px;
   padding-left: 1px;
   padding-right: 1px;
   padding-bottom: 2px;
}

我做错了什么？

AngularJS选择下拉列表未显示

0 个答案: