英文:
Right to left support for percent sign
问题
根据这个维基页面，对于阿拉伯语，应该显示为 %50 test，即百分比符号在数字之前。问题是如何强制实现所需的行为？浏览器是否原生支持此功能？是否已知有简单的方法来实现？
UPD。我将提供更多上下文。有一个带有输入文本属性的 Angular 组件，例如：
<component [label]="'test 50%'"></component>
然后它的模板如下：
<span>{{label}}</span>
在从左到右模式下，它可以正常工作。但是在启用从右到左模式时，文本会右对齐，但浏览器不会自动修改文本。我认为浏览器可能会自动修改文本的原因是，文本“test this!”会被浏览器自动修改为“!test this”。
那么，我是否需要修改组件以接受已经进行了从右到左修改的文本呢？
英文:
Let's say there is a piece of code as follows:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-html -->
<div dir="rtl">
test 50%
</div>
<!-- end snippet -->
It renders as test 50%. But according to this wiki page for Arabic language it should be displayed as %50 test. Note the percentage sign is before the number.
The question is as follows: how to enforce the desired behaviour? Do browsers support it OOB? Are there known ways to do that easily?
UPD. I will provide more context. There is an angular component with an input text property. Let's say it might look as follows:
<component [label]="'test 50%'"></component>
Then its template looks as follows:
<span>{{label}}</span>
It works correctly for left-to-right mode. But when right-to-left mode is enabled, the text is aligned to the right but the text is not modified by a browser. The reason why I think it might be modified by a browser automatically is that the text as follows test this! is modified to this: !test this automatically by a browser.
Does I need to modify the component so it accepts already RTL modified text?
答案1
得分: 2
尝试使用&rlm; - 代表从右到左标记的HTML字符实体。这是一个非打印字符，用于指示文本的方向性。
<!-- 开始片段：js 隐藏：false 控制台：true Babel：false -->
<!-- 语言：lang-html -->
<span dir="RTL">test 50‏%</span>
<!-- 结束片段 -->
更新：
评论中提到除了使用&rlm;之外，"50%"部分应该包含在自己的容器中。示例 - https://codesandbox.io/s/ecstatic-rain-8m209c
英文:
Try the &rlm; - HTML character entity that represents the right-to-left mark. It's a non-printing character used to indicate the directionality of text.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-html -->
<span dir="RTL">test 50&rlm;%</span>
<!-- end snippet -->
Update:
It was mentioned in the comments that in addition to using &rlm;, the "50%" part should be wrapped in its own container. Example - https://codesandbox.io/s/ecstatic-rain-8m209c
答案2
得分: 1
根据MDN文档：
dir全局属性是一个枚举属性，指示元素文本的方向性。
这意味着它将更改文本呈现的方向，但不会更改句子构造的顺序，除非它位于句子的开头/结尾。
你可能会注意到上图中的?实际上在第一句中移至了左侧。这是因为它是一个双向中性字符。然而，对于单词lef?t内或句子的其他部分中的?，不存在相同的含义。
英文:
According to MDN docs:
> The dir global attribute is an enumerated attribute that indicates the directionality of the element's text.
That means that it will change the direction in which the text is rendered, but not the order in which the sentence is constructed, unless it is at the start/end of the sentence.
You may notice in the picture above that ? was actually moved to the left side in the first sentence. That is because it is a bidi neutral character. However, the same implication does not exist for the ? inside the word lef?t or any other part of the sentence.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论