How to pass custom values in the tooltip?

[rahuldpi]

I have an array which I would like to display in the tooltip.

animals = ['Cat', 'Dog', 'Pig', 'Rat'];

configSlider: any = {
    behaviour: 'drag',
    snap: true,
    connect: false,
    step: 1,
    start: 0,
    range: {
      'min': this.animals[0],
      '33%': this.animals[1],
      '67%': this.animals[2],,
      'max': this.animals[3],
    }

<nouislider id="slider" [config]="configSlider"  [tooltips]="true"></nouislider>

I'm getting this error:

ERROR Error: noUiSlider (10.1.0): Missing 'min' or 'max' in 'range'.

[kiqq]

How to add custom formatter for tooltips: https://github.com/tb/ng2-nouislider/issues/140#issuecomment-352693962 2. You can edit code from this formatter to match your values: https://github.com/tb/ng2-nouislider/issues/107#issuecomment-327940463

Range needs number values: range: {min: 0, max: 3},

[rahuldpi]

I tried the example link which you shared. However, its displaying the array values as a ruler instead of displaying the values within the tooltip.

ngOnInit() {
    let pipFormats = ['abc', 'pqr','xyz','def'];
    this.section = this.data;
    this.options = this.data.options;
    this.optionsAnswer = this.data.optionsAnswer;
    console.log(pipFormats);
    this.configSlider = {
      behaviour: 'drag',
      snap: true,
      connect: false,
      step: 1,
      start: 0,
      range: {
        'min': [1],
        '33%': [2],
        '67%': [3],
        'max': [4]
      },
      pips: {
        mode: 'steps',
        format: {
          to (value: number){
            console.log(pipFormats);
            return pipFormats[value];
          }
        }
      }
    }
 }

[kiqq]

Please use tooltips isstead of pips like in first link:

  ngOnInit() {
    let pipFormats = ['abc', 'pqr','xyz','def'];
    this.config = {
      behaviour: 'drag',
      step: 1,
      start: 0,
      range: {min: 0, max: pipFormats.length-1},
      tooltips: {
          to (value: number){
            return pipFormats[value];
          }
      }
    }
  }

I made a mistake in the range in earlier comment. I'm sorry about that, it's correct now.