Ionic2,离子范围定制引脚的内容

Question

我使用ion-range同pin和steps.我得到范围引脚中的当前值,但我想在它旁边添加/附加一些文本.

到目前为止在离子API和docs中我没有找到修改范围引脚内容的方法,所以我想通过代码附加一个span,但到目前为止我知道要使用jQuery中的.append()函数.范围引脚的html是:

<div class="range-pin" role="presentation">1</div>

所以我想表现出来:

<div class="range-pin" role="presentation">1 item</div>

Answer 1

我知道有点晚了但如果有人遇到这个问题,我找到了以下解决方案:

HTML

<ion-range id="euroRange" debounce="250" pin="true" min="0" max="50" (ionChange)="formDidUpdate()" [(ngModel)]="price" color="secondary"></ion-range>

看看我如何在我的离子范围元素中添加一个名为euroRange的id .

CSS

#euroRange {
    .range-pin:after {
        content: " €";
    }
}

在euroRage id 里面,我添加了.range-pin:之后意味着我指定的任何内容都应该在引脚的正常内容之后直接完成.

随着内容我添加了一个空格和€符号.

这是 结果.