Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

ng-repeat='size in sizes' input ng-model='size[$index]' - duplicating values on .push() #1466

Closed
zivester opened this issue Oct 16, 2012 · 6 comments

Comments

@zivester
Copy link

I'm trying to bind to an array of arbitrary length, and add more values if certain constraints are met. In this fiddle, I want to add new inputs when all the other inputs have a value set.

http://jsfiddle.net/JPJd3/8/

As you can see after typing into the empty input, the value is replicated into the new input.

I've seen #905 and #1267, but I'm not sure if those apply here (the second one's fiddle is gone).

UPDATE: This works utilizing $timeout (original still seems like a bug):

http://jsfiddle.net/JPJd3/11/

@tombouctou
Copy link

Hi!
This problem still replicates for angular 1.0.2.

@mhevery
Copy link
Contributor

mhevery commented Nov 15, 2012

Try this http://jsfiddle.net/JPJd3/13/

ng-repeat needs to have stable model, in your case the model changes as the user types which confuses the ng-model. Once you create a stable model the issue goes away.

Stable model means that the DOM is in sync with the object identities in the repeater. When you have '' and then you type 'b' as far as ng-repeat is concerned '' when away and 'b' was added, it can not deduce that really you are just changing the value.

@mhevery mhevery closed this as completed Nov 15, 2012
@petebacondarwin
Copy link
Contributor

By the way, in your fiddle, you push({test: ''}); because push(null) doesn't work.

Actually any primitive will fail here: push(22) and push(''). All you need is any object and the ng-model will sort out the text field on it. So $scope.sizes.push({}); works.

This is because, I guess, ng-model is receiving a null (primitive value) and is not able to tell where the null comes from. So can't go back to the array and update it.

@gleb-svechnikov
Copy link

Miško in your example, model binding breaks down if I use type url or type email for input. However it works with other types like search, text or tel. Is it supposed to be like this or it is a bug? Here is a fork with changed type http://jsfiddle.net/gleb_svechnikov/NQS7v/

@caitp
Copy link
Contributor

caitp commented Jul 12, 2014

@gleb-svechnikov invalid values have an undefined value, and the change listeners won't be called if the value changes from invalid -> invalid, because the value looks like it hasn't changed. This is still true in more recent versions of angular.

@zeeshangithub
Copy link

shange

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants