mercredi 18 février 2015

AngularJS: ng-model does not update when ng-options refreshes


I'm new to AngularJS, so I apologize if this question is naive.


We have cascading selects that populate as you select values. When the value of Select A changes, the values in Select B also change since they filter based on the value in Select A.


So here is the scenario:



  1. Choose option from Select A

  2. Choose option from Select B

  3. Change selection for Select A

  4. Observe that options in Select B update accordingly.

  5. Observe that bound model for Select B does not update accordingly.


This seems so basic that we are really scratching our heads. What is the point of two-way data binding if this scenario isn't covered?


Here is my view:



<body ng-controller="MainCtrl">
Make:
<select ng-model="makeng" ng-options="option.value as option.display for option in makes">
<option ng-disabled="true" ng-selected="true" value="">Select a make</option>
</select>
<br />
{{makeng}}

<br /> <br />

Model:
<select ng-model="modelng" ng-options="option.display for option in models | filter:{make:makeng}">
<option ng-disabled="true" ng-selected="true" value="">Select a model</option>
</select>
{{modelng}}
</body>


Here's a Plunkr, demonstrating: http://ift.tt/1Lc1dsM


P.S. The above example is purely fictional and forked from another plunkr. Just the easiest way to demonstrate what we are seeing.





Aucun commentaire:

Enregistrer un commentaire