javascript - 带图像的 Angular 选择

Question

情况:

我需要在语言选择中插入标志。我在 Google 和 StackOverflow 中进行了搜索，但找到的解决方案对我不起作用。

代码:

在 Controller 中:

 $scope.language_list = [{'name': 'english', 'url': 'https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/16/country-4x3/gb.png'},{'name': 'italian', 'url': 'https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/16/country-4x3/it.png'}];

在 View 中:

<select ng-model="language_selected">
    <option ng-repeat="language in language_list" data-image="{{language.url}}" >{{language.name}}</option>
</select>

示例:

http://jsfiddle.net/tcVhN/168/

问题:

如何在 Angular 选择内插入图像？

编辑:

这是解决方案的 Plunker，已清理:

http://plnkr.co/edit/hMlNjkDL3l0QKF37pCa0?p=preview

Answer 1

作为其他答案，您不能使用 <options>要添加图像，但是您可以使用 Angular 模块 ui-select 来实现你想做的事情。

这是一个demo with ui-select with your data .

清理代码并获得您需要的内容。

如果您对搜索框不感兴趣，请将 CSS 覆盖为，

 .select2-search {
      display: none;
 }

DEMO