Search code examples
javascriptangularjstwitter-bootstrapangular-ui-bootstrapangularjs-ng-options

angularjs select the first value in select box


I need to highlight the first value 'fullName' in select box using angularjs. I am using angularstrap selectbox.

controller,

  $scope.accountInfo.owners = [  
   {  
      "accounts":null,
      "phoneumber":null,
      "email":null,
      "fullName":"MITA DASGUPTA",
      "mobilePhoneNumber":null,
      "noteFlag":false,
      "number":130000000484
   }
]

Template,

<button type="button" class="btn btn-default" placeholder="Pleasae select" 
  data-ng-model="owner.fullName" 
  data-html="1" 
  bs-options="owner as owner.fullName for owner in accountInfo.owners"  
  bs-select>
    Action <span class="caret"></span>
</button>

I tried that way, but the value not selecting by default.


Solution

  • You should have some different ng-model name you already used owner in ng-options like selectedOwner

    <button type="button" class="btn btn-default" placeholder="Pleasae select" 
      data-ng-model="selectedOwner" 
      data-html="1" 
      bs-options="owner as owner.fullName for owner in accountInfo.owners"  
      bs-select>
        Action <span class="caret"></span>
    </button>
    

    Then you need to set value of ng-model from controller.

    $scope.selectedOwner = $scope.accountInfo.owners[0];