Select2 Standard ausgewählt von optgroup

Question

Benötigen Sie Hilfe hier. Ich habe diesen Code geerbt und ich bin nicht 100% darauf, was hier zu tun ist, aber ich muss den voreingestellten ausgewählten Eintrag als erste Gruppe/erste Option anstelle von data-placeholder festlegen. Ich versuchte mit ng-init, aber ich war nicht in der Lage, es zur Arbeit zu bekommen. Wie erreiche ich das mit dem untenstehenden Code?

<div ng-repeat='searchField in searchFields.device'> 
    <select data-placeholder='Search Field' ng-model='searchField[0]' ui-select2> 
     <option value=''></option> 
     <optgroup label='FooGroup1'> 
      <option value='foo_option1'>foo_option1</option> 
     </optgroup> 
     <optgroup label='FooGroup2'> 
      <option value='foo_option1'>foo_option1</option> 
      <option value='foo_option1'>foo_option1</option> 
     </optgroup> 
    </select> 
.... 

ACTUAL HAML

%div(ng-repeat="searchField in searchFields.message") 
    %select(ng-model="searchField[0]" ui-select2 data-placeholder="Search Field" ng-init="searchField[0] = ") 
    %option(value="") 
    - devices_optgroup.each do |group, attrs| 
     %optgroup{label: group} 
     - attrs.each do |attr, label| 
      %option(value="#{attr}")= label 

Answer 1

Das <option> Element ermöglicht ein optional selected Attribut. Von MDN:

ausgewählt Falls vorhanden, das Boolesche Attribut gibt an, dass die Option zunächst ausgewählt. Wenn das Element der Nachkomme eines Elements ist, dessen Mehrfachattribut nicht festgelegt ist, kann nur ein einziges Element dieses Elements das ausgewählte Attribut aufweisen.

Also, wenn Sie das erste Element des ersten <optgroup> auswählen möchten, können Sie etwas tun:

<select data-placeholder='Search Field' ng-model='searchField[0]' ui-select2> 
    <option value=''></option> 
    <optgroup label='FooGroup1'> 
     <option value='foo_option1' selected>foo_option1</option> 
    </optgroup> 
    <optgroup label='FooGroup2'> 
     <option value='foo_option1'>foo_option1</option> 
     <option value='foo_option1'>foo_option1</option> 
    </optgroup> 
</select>