joaoneto / angular-bootstrap-select

DEPRECATED DON'T USE - Directive to wrap bootstrap-select
105 stars 81 forks source link

Default picker choice? #42

Open maeishoj opened 9 years ago

maeishoj commented 9 years ago

Hi there.

I am using this and I am very happy with it.

However I am not sure how to go about selecting the default choice for the picker...

Currently i do this:

<select class="m-l-20 pull-right selectpicker" selectpicker ng-model="currentLanguage">
    <option ng-repeat="language in defaultLanguage" data-content="<span class=''><img src='/assets/img/flags/{{language.Value}}.png'/> {{language.Name}}</span>" value="{{language}}"> </option>

    <option ng-repeat="language in campaign.Languages" data-content="<span class=''><img src='/assets/img/flags/{{language.Value}}.png'/> {{language.Name}}</span>" value="{{language}}"> </option>
</select>

But it seems a very nasty way of doing it.. Basically I have my Languages as objects in an array (campaign.Languages) but in order to have the first language selected by default I have to add the first

There must be a better way of doing this..

madmoizo commented 9 years ago

yes, it's nasty :)

basic example :

<select selectpicker 
     ng-model=".currentLanguage" 
     ng-options="language.value as language.label for language in languages track by language.value">
</select>

if language.value = ng-model, it will be selected

with somethin like this in your controller (coffeescript syntax)

languages = [
  {
      value: "fr"
      label: "<img src='/assets/img/flags/fr.png'/> French"
  }
  {
      value: "en"
      label: "<img src='/assets/img/flags/en.png'/> English"
  }
]