Skip to content
This repository has been archived by the owner on Feb 15, 2024. It is now read-only.

dynamic disabling does not work with reactive forms #12

Closed
mmestas opened this issue Jan 9, 2024 · 2 comments
Closed

dynamic disabling does not work with reactive forms #12

mmestas opened this issue Jan 9, 2024 · 2 comments
Assignees
Labels
bug Something isn't working

Comments

@mmestas
Copy link

mmestas commented Jan 9, 2024

import { Options as SliderOptions } from 'ngx-slider-v2';
Here are my options:

sliderOptions: SliderOptions = { 
    floor: 0,
    ceil: 100,
    showSelectionBar: true,
    hidePointerLabels: true,
    hideLimitLabels: true,
    disabled: false
  };

html
<ngx-slider [options]="sliderOptions" formControlName="rxvolume"></ngx-slider>

dynamically disable/enable

disableEnableFields(disabled: boolean) {
    this.sliderOptions = Object.assign({}, this.sliderOptions, {disabled: disabled});
    disabled ? this.form.disable() : this.form.enable();
  }

This works if I don't have the formControlName on the directive. With the formControlName, it adds the [disabled]='disabled' to the DOM, and the classes show up, but I can still move the slider. The same goes in reverse. If I start with the slider options set to disabled: true. it IS disabled and I cannot move the slider, and dynamically setting disabled to false does not allow me to move the slider. Again, this only seems to be the case when I'm using formControlName. If I don't, it disables/enables the slider dynamically without issue.

Edit: This also seems to be affected because of enabling, disabling the form dynamically. When this line
disabled ? this.form.disable() : this.form.enable();
is removed, the slider enables/disables as it should.

@danisss9 danisss9 self-assigned this Jan 11, 2024
@danisss9 danisss9 added the bug Something isn't working label Jan 11, 2024
@danisss9
Copy link
Owner

From what i understood the problem only occurs when you try to disable the control using the form right?

If you have "formControlName" in html but disable the slider using only the sliderOptions object it works?

@danisss9
Copy link
Owner

Copied to main repo

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants