title: How to make a preselection for a select list generated by AngularJS?
body: <pre><code>&lt;select ng-model="team.captain" ng-options="player.name for player in team.players"&gt;&lt;/select&gt;
  </code></pre>
  
  <p>This correctly creates a select list to choose the team captain. However, by default a blank option is selected. How can we preselect the first player from the list instead?</p>
  
  <pre><code>&lt;select ng-model="team.captain" ng-options="player.name for player in team.players" class="ng-pristine ng-valid"&gt;
    &lt;option value="0"&gt;John&lt;/option&gt;
    &lt;option value="1"&gt;Bobby&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>I tried adding <code>ng-init="team.captain='0'"</code> but that didn't help.</p>
  
  <p><strong>Update</strong> Apparently this happens because </p>
  
  <blockquote>
    <p>a value referenced by ng-model doesn't exist in a set of options passed to ng-options.</p>
  </blockquote>
  
  <p>Source: <a href="https://stackoverflow.com/questions/12654631/why-does-angularjs-include-an-empty-option-in-select?rq=1">Why does AngularJS include an empty option in select?</a></p>
  
  <p>However, the question still remains why using ng-init doesn't work?</p>
  
  <pre><code>&lt;select ng-init="team.captain='0'" ng-model="team.captain" ng-options="player.name for player in team.players"&gt;&lt;/select&gt;
  </code></pre>