javascript - 如何使用 Angular 填充 select ng 选项

Question

我尝试使用 Angular ng选项填充选择中的值。在我的数组对象中，如果数组中没有“id”属性，我不应该在选择中添加值。

期望:

应仅填充数组对象中具有“id”属性的值。

当前行为:

目前，它无法正确过滤，并且没有 id 属性的对象在选择选项中显示为空。添加了图像当前的外观，它不会跳过其中没有“id”属性的数组属性。

图片:

JSON:

[
  {
    "name": "abc"
  },
  {
    "id": 123,
    "name": "def"
  },
  {
    "id": 456,
    "name": "ghi"
  }

]

HTML:

<select id="selectBox" ng-model="vm.selectedVal" ng-change="vm.selectChange()"
ng-options="myobj.id as (myobj.name ? (myobj.name + ' - ' + (myobj.id | formatId)) : (myobj.id | formatId)) for myobj in (vm.myobj | filter:{id:'!!'}) track by myobj.id">
</select>

Answer 1

您的代码运行良好，空白不是数组项，但未设置模型值，因此它正在添加一个项目，给出一个默认值，例如“--选择一个项目--”

试试这个:

<select id="selectBox" 
      ng-model="vm.selectedVal"
      ng-options="item.id as item.name for item in list  | filter:emptyOrNull">
      <option value="">Select One</option>
</select>

在 Controller 上:

$scope.emptyOrNull = function(item){
  return !(item.id == null || item.id == undefined)
}