Question

我正在使用Ember实现下拉列表，但我无法使用把手表达式设置选项元素的selected属性。

这是显示问题的ember-twiddle example。请注意，在旋转的DOM中，如果顶部示例没有显示所选属性。

<select
    aria-disabled="{{disabled}}"
    aria-multiselectable="{{multiselect}}"
    disabled={{cannotOpen}}
    onchange={{action 'itemClicked' value='target.value'}}
>
    <option selected disabled value="">{{placeholder}}</option>

    {{#each items as |item|}}
        <option 
            value={{item.value}}
            selected={{if (is-item-selected item.state) "selected"}}
            disabled={{item.disabled}}
        >
            {{item.name}}
        </option>
    {{/each}}
</select>

“is-item-selected”是一个自定义助手，如果“item.state”则返回true === 2“，在下拉列表中选择项目时会这样做。

无论我在把手中尝试什么，都不会显示所选属性（例如 selected = {{if true“selected”}} 也不起作用。但是，将已选择更改为数据选择的工作方式与预期完全相同。

有人知道这个问题吗？或者我误解了所选属性应该如何工作？

Answer 1

所以这实际上是dom / html的“功能”。类和数据属性是属性，而selected是property。

有一个great write-up here (about this same issue!)

如果你想直接（我从另一个答案中偷走了这个）：.prop() vs .attr()

选择选项不起作用的选定属性（Ember.js + Handlebars）

1 个答案: