javascript - 具有 HTML 输入范围的 Ember.js 组件未正确设置值

Question

我有一个简单的 Ember 组件，仅包含一个输入范围 slider ，如下所示:

<input
  type="range"
  value=500
  min=0
  max=500
>

当它最初渲染时， slider 的位置并未像您期望的那样设置到最末端。它设置在 100 左右的位置。

Answer 1

解决办法是改变属性的顺序，将值设置在max之后:

<input
  type="range"
  min=0
  max=500
  value=500
>

通常在 HTML 中，属性的顺序并不重要。然而，在这种情况下，Ember 似乎将其转换为以下内容:

let input = document.createElement('input');
input.setAttribute('type', 'range');
input.setAttribute('value', 500);
input.setAttribute('min', 0);
input.setAttribute('max', 500);

default max of an input is 100 。在这种情况下，在设置“max”之前将“value”设置为 500 是无效的，因此会设置为 100。

查看讨论here .