tb / ng2-nouislider

Angular2 noUiSlider directive
http://tb.github.io/ng2-nouislider/
MIT License
184 stars 114 forks source link

noUiSlider: 'start' option is incorrect. #105

Closed elsatom closed 6 years ago

elsatom commented 7 years ago

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.

kiqq commented 7 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