salix/front/core/components/input-range/index.js

80 lines
1.6 KiB
JavaScript

import ngModule from '../../module';
import Input from '../../lib/input';
import './style.scss';
export default class inputRange extends Input {
constructor($element, $scope) {
super($element, $scope);
this.mdlElement = this.element.querySelector('.mdl-slider');
componentHandler.upgradeElement(this.mdlElement);
this.mdlElement.addEventListener('change', () => {
this._value = this.input.value;
this.$.$applyAsync();
if (this._value && this.onChange)
this.emit('change', {value: this._value});
});
}
get value() {
return this._value;
}
set value(value) {
this._value = value;
this.mdlElement.MaterialSlider.change(value);
}
get max() {
return this.input.max;
}
set max(value) {
this.input.max = value;
}
get min() {
return this.input.min;
}
set min(value) {
this.input.min = value;
}
get step() {
return this.input.step;
}
set step(value) {
this.input.step = value;
}
get() {
return this._model;
}
set model(value) {
this._model = value;
}
set disabled(value) {
this.input.disabled = value;
}
}
inputRange.$inject = ['$element', '$scope'];
ngModule.component('vnInputRange', {
template: require('./index.html'),
controller: inputRange,
bindings: {
label: '@?',
disabled: '<?',
min: '<?',
max: '<?',
step: '<?',
value: '=',
model: '=',
onChange: '&'
}
});