Question

我在页面上有一个AngularJS Select控件，这些选项基于rest查询动态限制。在初始页面加载时，我可以看到选择选项。但是一旦我选择了一个选项，选择控制选项就会消失（被清空）。如果我进行页面刷新（浏览器刷新），那么我可以再次看到选项。

如何确保即使在选择值后，选项也总是被选中控制？

<select id="ddlLanguage" class="input-block-level" ng-model="languagedata" ng-options="rows1.Language for rows1 in languagedata" ></select>

myAngApp.controller('myController', function ($scope, $http) {

   $http({
     method: 'GET',
     url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('LangHelpFiles')/items?$select=Language",
     headers: { "Accept": "application/json;odata=verbose" }

     }).success(function (data, status, headers, config) {
        $scope.languagedata= data.d.results;    

     }).error(function (data, status, headers, config) {
        alert(status);
  });//end http

});//end controller

Answer 1

ngModel="languagedata"导致了这个问题。选择选项时，languagedata将设置为所选选项的值，因此选项将消失。如果将范围中的其他变量绑定到选项，则可以解决问题。

Answer 2

<select id="ddlLanguage" class="input-block-level" ng-model="language" ng-options="rows1.Language for rows1 in languagedata" ></select>

myAngApp.controller('myController', function ($scope, $http) {

$http({
 method: 'GET',
 url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('LangHelpFiles')/items?$select=Language",
 headers: { "Accept": "application/json;odata=verbose" }

 }).success(function (data, status, headers, config) {

    $scope.languagedata= data.d.results;
    $scope.language = $scope.languagedata[0];  

 }).error(function (data, status, headers, config) {
    alert(status);
 });//end http

})

AngularJS Select Control不重新绑定选项

2 个答案: