0

I have a select list which is rendered via an ng-repeater and on change it fires the value of the selected option into a function this works as expected.

The issue I am now stuck on is if the page is loaded with a specific option requested how I ensure that select option is highlighted.

I have it so the GUID which is the value of the select is automatically fired to the function to get the page data for the selected item so that's working the issue is highlighting the selected item in the select list to show the user its related to that selection.

My code is below but you will see that I am binding it to ng-model="asCtrl.accSelected" which passed the GUID value. My assumption was that when a predefined GUID is requested I can set vm.accSelected to be equal to the GUID value and that should due to the 2 way binding show the selection on the select list but this doesn't seem to be the case.

<div data-ng-controller="tpAccStatusCtrl as asCtrl">
  <select class="form-control" ng-model="asCtrl.accSelected" ng-change="asCtrl.retrieveAccount(asCtrl.accSelected)">
   <option value="select" selected="selected">Select an Account</option>
   <option ng-repeat="acc in asCtrl.accounts" value="{{acc.UniqueIdentifier}}">{{acc.AccountName}}</option>
  </select>
</div>

I hope the above makes sense and someone can show me how to ensure the select list reflects the value set for vm.accSelected

user3779703
  • 507
  • 1
  • 6
  • 20
  • Try this solution http://stackoverflow.com/questions/35336364/ng-options-doesnt-show-the-ng-model-object-in-the-select-box-on-load-angularjs/35336819#35336819 – Stepan Kasyanenko Feb 11 '16 at 12:02

1 Answers1

0

Call the asCtrl.retrieveAccount(asCtrl.accSelected) function manually on page load. Ng-change will only trigger if the value is changed by the input, if I'm not mistaken.

xtrinch
  • 2,232
  • 1
  • 24
  • 46