html - 如何为选择的 Angular 添加 rtl 支持

Question

我正在使用 angular with chosen (source)，我正在尝试添加 rtl 支持，这是我的演示。我读过这个，但它不起作用。

问题是当单击选择列表后 body 具有 dir="rtl"属性时，页面会水平滚动。

 <select class="chzn-rtl" chosen disable-search="false"
  no-results-text="'Tough luck'"
  ng-model="bar">
    <option>Hi</option>
    <option>This is fun</option>
    <option>I like Chosen so much</option>
    <option>I also like bunny rabbits</option>
    <option value=""></option>
  </select>

Demo

Answer 1

这是因为 chosen 下拉列表永远不会关闭 &在启动时，它位于滚动条末端的最左侧。

CSS

.chosen-container{
  .position: fixed;
  z-index: 99;
}

在你的样式中添加将解决这个问题。我还没有找到任何好的修复方法。这是一些 hacky 方法，但我发现了这个解决方法。

Working Plunkr

谢谢。