Skip to content

input range& ngModel: setting min/max and value at same time #9699

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
ghetolay opened this issue Jun 29, 2016 · 4 comments
Closed

input range& ngModel: setting min/max and value at same time #9699

ghetolay opened this issue Jun 29, 2016 · 4 comments

Comments

@ghetolay
Copy link
Contributor

ghetolay commented Jun 29, 2016

I'm submitting a bug report

Current behavior
If we have a component with the following template :

<input type="range"
  min="{{min}}"
  max="{{max}}"

  [ngModel]="value">

Setting boundary value (min or max or both) and input value at same time won't set the input value correctly.

updateRange() {
    this.min = 0;
    this.max = 50;
    this.value = 25; //won't be at the center
}

As a workaound we can delay the value update to the next tick :

updateRange() {
    this.min = 0;
    this.max = 50;
   setTimeout( () => this.value = 25, 0); //will work as expected
}

I've created a plunker : http://plnkr.co/edit/T8NKmEW7Y5EYHrpetPJk?p=preview
There is a similar issue for Angular 1 : angular/angular.js#6726

Angular version: 2.0.0-rc.1 to 2.0.0-rc.3

@ghetolay ghetolay changed the title input range, setting) and value at same time input range, setting min/max and value at same time Jun 29, 2016
@ghetolay ghetolay changed the title input range, setting min/max and value at same time input range& ngModel: setting min/max and value at same time Jun 29, 2016
@amitdahan
Copy link

amitdahan commented Sep 4, 2016

This is still happening on RC5, probably RC6 too, will test soon.

@DzmitryShylovich
Copy link
Contributor

@ghetolay is this still an issue after final? can u pls update plunkr

@ghetolay
Copy link
Contributor Author

Ok, made a new plunker it's fixed.

Thks !

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

5 participants