angular ng-option添加图标

时间:2017-09-27 05:47:05

标签: html angular

我正在尝试编写一个用于选择国家/地区的下拉列表,是否可以在国家/地区名称旁边添加国家/地区的标志? enter image description here

 <div class="chosen-input-group col-sm-10 ">
        <select id="country_type" chosen data-placeholder="-- 國家 --" disable-search="false"
                ng-options="country_.country_id as country_.name  for country_ in vm.country_data" 
                ng-model="vm.item.country_id">
            <option value=""> -- 國家 --</option>
        </select>
    </div>

2 个答案:

答案 0 :(得分:2)

您可以在选项标签上使用ng-repeat,然后根据需要为图像添加样式

<select >
  <option ng-repeat="country_ in vm.country_data"
  value="country_.country_id"
  style="background-image:url({{country_.name}}.png);">
    {{ country_.name }}
  </option>
</select> 

答案 1 :(得分:1)

使用带有选项的原生选择是不可能的。 看看https://github.com/angular-ui/ui-select

Soruce:Angular select with images