3

I know this is weird. I'll transform the API Data if this isn't possible.

But, I need multiple dropdowns to share the same ng-model.

Question:

  1. Why does does ng-model unique when it has the same var name?

  2. How do I make each drop down share one ng-model="selectedSize"

    <div ng-repeat="(key, val) in listing.colors_and_sizes.data" >
<p>{{selectedSize}}</p>
 <input
    ng-checked="selected"
    type="radio"
    name="colors"
    ng-model="selected.pdw.color"
    ng-value="key"/>

<select ng-model="selectedSize"
        ng-options="choice as choice for (idx, choice) in val.sizes.split(',')"
        ng-change="selected.product.set.size(key,val, selectedSize);">
        <option value="">Please select a size</option>
</select>

</div>
PSL
  • 123,204
  • 21
  • 253
  • 243
Armeen Moon
  • 18,061
  • 35
  • 120
  • 233
  • If you use the same ng-model selection in one select will update other select repeated as well with the same value. Is that what you need? ng-repeat creates a child scope so `selected` size is a property on that child scope, so each of them has its own. – PSL Jan 09 '15 at 23:02

1 Answers1

1

ng-repeat creates a child scope so selectedSize is a property on that child scope, so each of them will have its own selection. Read this answer related to child scope inheritance and how it applies to various directives. If you want to share the same ng-model you just need to defined a scope property on your controller. ex:-

 $scope.size = {};

and set your ng-model as ng-model="size.selectedSize":

<select ng-model="size.selectedSize"
        ng-options="choice as choice for (idx, choice) in val.sizes.split(',')"
        ng-change="selected.product.set.size(key,val, size.selectedSize);">
        <option value="">Please select a size</option>
</select>

You do not need to pass the size.selected it will be available in your controller as well, but no harm passing it though.

Community
  • 1
  • 1
PSL
  • 123,204
  • 21
  • 253
  • 243
  • We really, really need a reference question to close these questions about the dot rule as duplicate… – Blackhole Jan 09 '15 at 23:11
  • @Blackhole Then there wouldnt be all these free points! – Armeen Moon Jan 09 '15 at 23:19
  • @MatthewHarwood Yep. That's one part of the problem, indeed. – Blackhole Jan 09 '15 at 23:24
  • That was a stupid mistake. I am willing to delete my answer provided, OP unaccepts my answer. I don't need _free points_ :/ (well they are not so free though, there is some effort in it) . you don't get any free points without atleast some little effort. :) – PSL Jan 09 '15 at 23:34
  • @PSL I was sincere in my first comment, which was not a critic against you: we really have no reference question about the dot rule, and therefore your answer here is usefull and necessary. ["What are the nuances of…"](http://stackoverflow.com/questions/14049480/what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs) gives the correct answer but is too broad for all the questions like this one, where the answer is just basically "use the dot rule". – Blackhole Jan 10 '15 at 01:21