Select2デフォルトからオプトグループ

Question

を選択してください。私はこのコードを継承し、ここで何をする必要があるのか​​100％ではありませんが、data-placeholderの代わりに最初のグループ/最初のオプションにデフォルトの選択項目を設定する必要があります。 ng-initを使ってみましたが、動作させることができませんでした。 これを以下のコードでどのように達成できますか？

<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

<option>要素はオプションselected属性を可能にします。 MDNから：

選択 存在する場合、このブール属性はオプションを最初に選択されていることを示しています。要素が複数の属性が設定されていない要素の子孫である場合、この要素の1つのみが選択された属性を持つことができます。

ですから、最初<optgroup>の最初の要素を選択したい場合は、このような何かを行うことができます。オプションは、ビルド方法や、後に定義されているので、これはHAMLに書き込まれる方法

<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>