Question

http://plnkr.co/edit/8Uks2e7tJ78Ax5bMbup2?p=preview

我想为每个项目添加两个图标。我做到了：

<ui-select-choices repeat="lang in language_list">
  <img ng-src="{{ lang.url }}" />
  <img ng-src="{{ lang.url }}" />
  <div ng-bind-html="lang.name | highlight: $select.search" style="display: inline"></div>
</ui-select-choices>

但是在选择项目之后，所选控件中没有第二个图像。我怎样才能获得两张图片？

Answer 1

我将此代码添加到控制器：

$scope.onSelected = function (selectedItem) {
    //do selectedItem.PropertyName like selectedItem.Name or selectedItem.Key 
    //whatever property your list has.

    var result = document.getElementsByClassName("select2-chosen")[1];
    var contentTr = angular.element('<img class="ng-scope" ng-src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/16/country-4x3/gb.png" src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/16/country-4x3/gb.png">');

    if (angular.element(result).children().length > 2) {
        angular.element(result).children()[0].remove();
    }
    var wrappedResult = angular.element(result).prepend(contentTr);
}

并添加了此代码：

on-select="onSelected($item)"

以ui-select html作为属性。

ui-选择两个图像

1 个答案: