ng-repeat和select/optgroup与预期不符 [英] ng-repeat and select/optgroup not as expected

问题描述

我在使用ng-repeat并选择时遇到问题.

I am having an issue with using ng-repeat and select.

首先是我的代码

        <select>
            <optgoup ng-repeat="(key, value) in Widget.ids" label="{{ value.label }}">
                <option ng-repeat="id in Widget.ids[key].ids">{{ id }}</option>
            </optgroup>
        </select>

我的数据看起来像这样

        [ 
        { label: "My Label", ids: [ "one id", "another id" ] },
        { label: "My Other Label", ids: [ "one id", "another id" ] }
        ]

但是，这将返回一个完全空的<select>. 令人沮丧的是，如果我将HTML更改为以下形式:

However, this returns a completely empty <select>. What's frustrating, is if I change my HTML to look like this:

            <div ng-repeat="(key, value) in Widget.ids">{{ value.label }}
                <div ng-repeat="id in Widget.ids[key].ids">{{ id }}</div>
            </div>      

然后列出..

My label
one id
another id
My Other Label
one id
another id

实际上，如果删除<select>标记并保留<​​c2> etc标记，则它将实际上生成正确的DOM元素.

In fact if I remove the <select> tag and leave the optgroup etc tags then it will actually generate the correct DOM elements.

此外，我不能简单地使用ng-model，因为我将为其他模型保留该模型. (Widget.my.path.widget_id)

Also, I can't use simply use ng-model as I will be reserving that for a different model. (Widget.my.path.widget_id)

那么这是怎么回事?

推荐答案

此朋克车应该工作:

<select>
    <optgroup ng-repeat="(key,value) in data" label="{{value.label}}">
      <option ng-repeat="id in value.ids">{{id}}</option>
    </optgroup>
  </select>

这篇关于ng-repeat和select/optgroup与预期不符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！