Question

下面的函数来自 angularjs 控制器并动态设置下拉列表的值，它可以工作，但第一个选项始终为空白，值为“？”。我应该如何修改函数以删除空白选项或将所选选项设置为 items[0]？

--编辑--

我还没有发布完整的控制器，它来自一个 3rd 方包，控制器显示当下拉值改变时调用 u 函数。

有 2 个下拉菜单，当一个更改另一个应该用新数据更新时，这部分可以工作，但新数据有上面提到的额外空白选项。

谢谢

   function u() {
          var subs;
          if (n.model.alias == "group") {
              var selectedGroup = document.getElementById("group").value;
              subs = angular.element(document.getElementById('subGroup')).controller();

              $.ajax({
                  url: "/umbraco/Api/ContentmentCustomApi/GetSubGroups",
                  type: "GET",
                  cache: false,
                  async: false,
                  data: { selectedGroup: selectedGroup }
              }).then(function (data) {
                  subs.items = data;
                });
          };
  }

      <div class="contentment" ng-class="vm.uniqueId" ng-controller="Umbraco.Community.Contentment.DataEditors.DropdownList.Controller as vm">     
        <select id="{{model.alias}}"             class="umb-dropdown"             lk-html-attributes="vm.htmlAttributes"             ng-model="model.value"           ng-change="vm.change()"       ng-options="item.value as item.name disable when item.disabled for item in vm.items">         
    
        </select> 
      </div>

Answer 1

当您设置 model.value 时，应该为 ngOptions 重新分配值。

基于您问题中的代码的类似内容

subs.items = data;
n.model.value = subs.items[0];

select的第一个选项为空的原因是，ng-model引用的值在ng-option的列表中不存在。

请注意，有时值相同但引用不同。

进一步阅读：

https://docs.angularjs.org/api/ng/directive/ngOptions

<块引用>

默认情况下，ngModel 通过引用而不是值来观察模型。将选择绑定到作为对象或集合的模型时，了解这一点很重要。

<块引用>

如果您想预先选择一个选项，则会出现一个问题。例如，如果您将模型设置为与集合中的对象相同的对象，则 ngOptions 将无法设置选择，因为对象不相同。因此，默认情况下，您应该始终引用集合中的项目进行预选，例如：$scope.selected = $scope.collection[3]。

从 angularjs 下拉列表中删除空白选项

1 个答案: