将输入与独立于语言环境的滑块值同步
Synchronize Input with Slider values independent from locales
这是 的后续问题。
我发现 中的演示解决方案仅在滑块中有整数值且浏览器语言设置为英语时才有效。
演示片段:
<Input xmlns="sap.m"
xmlns:core="sap.ui.core"
core:require="{FloatType: 'sap/ui/model/type/Float'}"
type="Number"
value="{
path: '/value',
type: 'FloatType'
}"
/>
要重现问题:
- 转到浏览器的设置。
- 设置例如语言为德语。
- 重新加载演示。
如果随后将滑块的 step
设置为整数值(例如 1
),则所有值都会正确显示在输入字段中。
但是,对于 step="0.1"
,仅显示整数值,而隐藏浮点值(例如“1,4”),从而在浏览器控制台中引起警告:
The specified value "1,4" cannot be parsed, or is out of range.
有什么想法或更好的解决方案吗?
找到解决方案:
需要用“.”替换“,”的格式化程序:
formatStringToNumber: sNumber => parseFloat(sNumber.replace(","))
在输入的绑定中,然后简单地添加格式化程序:
<Input
width= "50px"
type="Number"
value="{
path: '/passageWidth',
formatter: 'formatStringToNumber',
type: 'FloatType',
formatOptions: { emptyString: 0 }
}"/>
在这种情况下,从 <Input>
控件中删除 type="Number"
。
UI5 中的 属性 type="Number"
不应与 value
绑定一起使用,因为浏览器稍微实现了 HTML <input type="number">
行为不同的是,根据 API 参考:
Only the default value sap.m.InputType.Text
may be used in combination with data model formats. (Source).
这是
我发现
演示片段:
<Input xmlns="sap.m" xmlns:core="sap.ui.core" core:require="{FloatType: 'sap/ui/model/type/Float'}" type="Number" value="{ path: '/value', type: 'FloatType' }" />
要重现问题:
- 转到浏览器的设置。
- 设置例如语言为德语。
- 重新加载演示。
如果随后将滑块的 step
设置为整数值(例如 1
),则所有值都会正确显示在输入字段中。
但是,对于 step="0.1"
,仅显示整数值,而隐藏浮点值(例如“1,4”),从而在浏览器控制台中引起警告:
The specified value "1,4" cannot be parsed, or is out of range.
有什么想法或更好的解决方案吗?
找到解决方案:
需要用“.”替换“,”的格式化程序:
formatStringToNumber: sNumber => parseFloat(sNumber.replace(","))
在输入的绑定中,然后简单地添加格式化程序:
<Input
width= "50px"
type="Number"
value="{
path: '/passageWidth',
formatter: 'formatStringToNumber',
type: 'FloatType',
formatOptions: { emptyString: 0 }
}"/>
在这种情况下,从 <Input>
控件中删除 type="Number"
。
UI5 中的 属性 type="Number"
不应与 value
绑定一起使用,因为浏览器稍微实现了 HTML <input type="number">
行为不同的是,根据 API 参考:
Only the default value
sap.m.InputType.Text
may be used in combination with data model formats. (Source).