javascript - 当范围更改时，Angular ng-options 值不会更新

Question

我在使用 ng-options 创建选择选项下拉列表时遇到问题。

范围结构

vm.filters = {
    perPage: 10, 
    settings: {
      perPage: {
        intervals: [
          {
            label: 'All',
            value: null
          }, {
            label: 10,
            value: 10
          }, {
            label: 25,
            value: 25
          }, {
            label: 50,
            value: 50
          }, {
            label: 100,
            value: 100
          }
        ]
      }
    }
 }

Dom Element( Angular 生成 option 标签)

<select name="selectPerPage" data-ng-model="vm.filters.perPage" data-ng-options="interval.value as interval.label for interval in vm.filters.settings.perPage.intervals">
    <option label="All" value="object:null">All</option>
    <option label="10" value="number:10" selected="selected">10</option>
    <option label="25" value="number:25">25</option>
    <option label="50" value="number:50">50</option>
    <option label="100" value="number:100">100</option>
</select>

当我将间隔数组中第一个对象的 value 属性从 null 更改为实际数字时，option 元素的范围不会更新。为什么？我怎样才能让它更新？这几乎就像范围更新时 ng-model 没有引用一样。

Answer 1

如果您使用ng-options，则不应像在选择中那样对选项进行硬编码。您只能硬一个(通常为空值)。

<select ng-model="vm.filters.perPage" 
        ng-options="interval.value as interval.label for interval in vm.filters.settings.perPage.intervals">
    <option label="All" value="">All</option>
</select>

我不知道 interval.value 是什么类型(数组、对象、字符串？)，但它应该保存在 vm.filters.perPage 中(假设vm.filters 存在)。