带空格的Ionic2范围

如何删除更新间隔下的行与范围本身之间的空格

我的代码：

<div class="range">
  <ion-list>
    <ion-list-header>
      update interval
      <ion-badge item-right>{{timePeriod}}</ion-badge>
    </ion-list-header>
    <ion-item>
      <ion-range min="1" max="60" [(ngModel)]="timePeriod">
        <ion-label range-left>1</ion-label>
        <ion-label range-right>60</ion-label>
      </ion-range>
    </ion-item>
  </ion-list>
</div>

更新间隔
{{timePeriod}}
1.
60

---

顺便说一句-可以将元素放在Ionic2中的标记内吗？

ion列表头的

元素有一个边距底部，因此可以将其设置为0以删除它：

ion-list-header.list-header { margin-bottom: 0; }

真正地我在一个plunker上测试了一下，效果不错。你能检查一下Chrome开发者工具中的元素并检查是否应用了样式规则吗？好的，现在可以了。谢谢你的解决方案。把蛋氨酸元素放进去怎么样？很高兴听到这个。关于div，没关系，您可以在html默认标记（如div和span）中添加离子组件。