SHARE
TWEET

Untitled

a guest Dec 6th, 2019 91 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import {Component, ViewChild, ElementRef} from '@angular/core';
  2. import {DecimalPipe} from '@angular/common';
  3. import { NouiFormatter } from "ng2-nouislider";
  4. import moment from 'moment';
  5.  
  6. /**
  7.  * @title Basic slider
  8.  */
  9. @Component({
  10.   selector: 'slider-overview-example',
  11.   templateUrl: 'slider-overview-example.html',
  12.   styleUrls: ['slider-overview-example.css'],
  13.   providers:[DecimalPipe],
  14. })
  15.  
  16. export class SliderOverviewExample {
  17.   @ViewChild('slider', {read: ElementRef}) slider: ElementRef;
  18.  
  19.   sliderRange;
  20.  
  21.   someKeyboardConfig: any = {
  22.     connect: true,
  23.     start: [2, 80],
  24.     step: 1,
  25.     tooltips: [new TimeFormatter(this.decimalPipe), new TimeFormatter(this.decimalPipe)],
  26.     range: {
  27.       min: 1,
  28.       max: 365
  29.     },
  30.     behaviour: 'drag',
  31.   };
  32.  
  33.   constructor(private decimalPipe: DecimalPipe) {};
  34.  
  35.   ngAfterViewInit() {
  36.     this.func();
  37.   }
  38.  
  39.   func() {
  40.     const connect = this.slider.nativeElement.querySelectorAll('.noUi-connect');
  41.     const classes = ['c-1-color', 'c-2-color', 'c-3-color'];
  42.     console.log(connect.length);
  43.     for (let i = 0; i < connect.length; i++) {
  44.       connect[i].classList.add(classes[i]);
  45.     }
  46.   }
  47. }
  48.  
  49. export class TimeFormatter implements NouiFormatter {
  50.   constructor(private decimalPipe: DecimalPipe) {};
  51.  
  52.   to(value: number): string {
  53.     console.log('aaaa', value);
  54.     // const output = moment().dayOfYear(value).toString();
  55.     const output = moment().dayOfYear(value).format('YYYY-MM-DD');
  56.     return output;
  57.  }
  58.  
  59.   from(value: string): number {
  60.     return Number(value.split(":")[0])*360+Number(value.split(":")[1]);
  61.   }
  62. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top