javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(range): add ability to add labels to the left/right of range

Browse Source 
using `range-left` and `range-right` inside of `ion-range` will place
the element to the left or right of the range.

references #5422
This commit is contained in:
Brandy Carney
2016-05-31 20:11:07 -04:00
parent 03f4511635
commit fc819dd9c4
12 changed files with 117 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/range/test/basic/index.ts
View File

@@ -1,7 +1,8 @@
import {App, Page} from '../../../../../src';
import {Component} from '@angular/core';
import {ionicBootstrap} from '../../../../../src';
@Page({
@Component({
templateUrl: 'page1.html'
})
class Page1 {
@@ -18,10 +19,11 @@ class Page1 {
}
@App({
@Component({
templateUrl: 'main.html'
})
class E2EApp {
rootPage = Page1;
}
ionicBootstrap(E2EApp);

12
src/components/range/test/basic/page1.html
View File

@@ -28,15 +28,19 @@
</ion-item>
<ion-item>
<div item-left>{{singleValue2}}</div>
<ion-label>init=150, min=-200, max=200</ion-label>
<ion-range min="-200" max="200" [(ngModel)]="singleValue2" secondary></ion-range>
<div item-right>{{singleValue2}}</div>
<ion-range min="-200" max="200" [(ngModel)]="singleValue2" secondary>
<ion-label range-left>-200</ion-label>
<ion-label range-right>200</ion-label>
</ion-range>
</ion-item>
<ion-item>
<ion-label>step=2, {{singleValue3}}</ion-label>
<ion-range min="20" max="80" step="2" [(ngModel)]="singleValue3"></ion-range>
<ion-range min="20" max="80" step="2" [(ngModel)]="singleValue3">
<ion-icon small range-left name="sunny"></ion-icon>
<ion-icon range-right name="sunny"></ion-icon>
</ion-range>
</ion-item>
<ion-item>