1

I currently list a set of options for ng-options from a resource that contains JSON. 

[  
   {  
      id:23,
      name:"Other"
   },
   {  
      id:24,
      name:"Crew"
   },
   {  
      id:25,
      name:"Announcer"
   },
   {  
      id:26,
      name:"Producer"
   },
   {  
      id:27,
      name:"Cameraman"
   },
   {  
      id:28,
      name:"Monitor"
   }
]

This is all added into my scope at $scope.broadcaster = response.data. I then loop through everything in my options by a simple ng-options.

     <select ng-model="selectedrole" ng-options="roles as roles.name for roles in broadcaster" ng-init="selectedrole=broadcaster[0]">
     </select>

Everything goes good once the page loads up. I can select from my list of names and the ng-init starts on the first selection as anticipated. However I have a few issues that I can't seem to resolve.

1) In my doc I set up {{selectedrole}} and I expected to see the contents of my model on the page reflected by my current selection. Instead I see no output at all. I can't tell if the model is even being updated properly so I'm not sure if I can use it in my formdata.

2) This select is generated on click so users can select a role for more than one person. However since the model is the same, any selection is copied over which ever one is changed. I need to find a way to output the model to check the data, but make that model dynamic so i can get a list of results from all the different selections.

EDIT:

Now this is really crazy. I mocked it up in a plunker and its at least showing the model just fine. Are there some conflictions I should worry about that would stop the model from updating? I literally copy pasted my data and its working in plunker but not my project.

http://plnkr.co/edit/GbdOmdjj1M3OuZKO5cSq?p=preview

EDIT2:

Even more info. As I stated before, the select is created when a user clicks on a function that creates an ng-repeat with user information and a new select option for role. If I place the {{selectedrole}} within that ng-repeat I actually get all the data returned when I user selects it. It seems that since the click creates a push of new data, it will not work outside each item. The issues now is that every instance has its own model so i need to figure out how to gather all this data from each ng-repeat and post it to the form. I'll try to update as I work through the issue.

Mr. BigglesWorth
  • 1,530
  • 3
  • 18
  • 33
  • check this out, no dot in ng-model might be a factor (ngoptions will create child scope) : http://stackoverflow.com/questions/17606936/angularjs-dot-in-ng-model – aarosil Oct 14 '14 at 02:56
  • Here is an explanation to your problem http://stackoverflow.com/questions/26290982/whats-the-difference-between-using-function-and-using-inline-expression-to-set/26291124#26291124 Answer talks about ng-if here it is ng-repeat both creates child scopes. This should clear up everything --> https://github.com/angular/angular.js/wiki/Understanding-Scopes – PSL Oct 14 '14 at 03:00
  • This seems to be the issue as adding something like {{selectedrole.select}} works fine. The issue there is that all models share and update one another. Issue seems to be getting more complex as i go. Thanks for the link, its at least helping me understand it better. – Mr. BigglesWorth Oct 14 '14 at 03:00

0 Answers0