Closed elsatom closed 6 years ago
<nouislider [config]="someRange2config"></nouislider>
someRange2config: any = {
behaviour: 'drag',
connect: true,
margin: 24 * 60 * 60 * 1000, //must be divisible by step
limit: 365 * 24 * 60 * 60 * 1000, //must be divisible by step
range: {
min: (new Date()).getTime(),
max: (new Date('2019')).getTime()
},
pips: {
mode: 'count', //there were too much pips to see anything
values: 3,
density: 3
},
step: 24 * 60 * 60 * 1000,
start: [new Date('2017').getTime(), new Date('2018').getTime()] //!!! getTime() !!!
};
OR Angular way:
<nouislider [(ngModel)]="someRange" [config]="someRange2config"></nouislider>
someRange2config: any = {
behaviour: 'drag',
connect: true,
margin: 24 * 60 * 60 * 1000, //must be divisible by step
limit: 365 * 24 * 60 * 60 * 1000, //must be divisible by step
range: {
min: (new Date()).getTime(),
max: (new Date('2019')).getTime()
},
pips: {
mode: 'count', //there were too much pips to see anything
values: 3,
density: 3
},
step: 24 * 60 * 60 * 1000
};
someRange: number|number[] = [new Date('2017').getTime(), new Date('2018').getTime()];
and make sure there is NOT something like this:
<nouislider [(ngModel)]="someRange" [config]="someRange2config"></nouislider>
someRange2config: any = {
//...
start: [new Date('2017').getTime(), new Date('2018').getTime()] //irrelevant overwritten by someRange
};
someRange: number|number[] = []; //causing error
someRange2config: any = { behaviour: 'drag', connect: true, margin: 1, limit: 5, // NOTE: overwritten by [limit]="10" range: { min: (new Date()).getTime(), max: (new Date('2019')).getTime() }, pips: { mode: 'steps', density: 5 }, step: 24 60 60 * 1000, start: [new Date('2017'), new Date('2018')] };
Showing an error start option is incorrect.