AngularJS Select - 自动 select 选项

Question

下午好，我在 Angular 中创建了一个 select 框，其中包含一个 FontAwesome 图标而不是文本。你可以在这里看到我不得不使用 ng-bind-html 来让它显示一个 unicode 值，但现在不起作用的是 select 框已打开，它不再是 'auto selects' 当前值。

Select 盒子

<select ng-model="item.IconCssClass" class="fontawesomeselect">
    <option ng-repeat="i in Icons" value="{{i.icon}}" ng-bind-html="i.unicode|html">    </option>
</select>

我的CSS:

.fontawesomeselect {
    font-family: FontAwesome, Lato;
    width: 40px;
}

在指令中（或多或少）：

scope.Icons = [
        { icon: 'fa-phone', unicode: '&#xf095;' },
        { icon: 'fa-gbp', unicode: '&#xf154;' }];

scope.item = { "IconCssClass": "fa-phone" };

select 选项根本不会自动 selected，如果我做错了什么有什么想法吗？

Answer 1

您将要使用 ng-selected directive 加载并选择正确的图标。

<option ng-selected="i.icon === item.IconCssClass" ng-repeat="i in Icons" value="{{i.icon}}" ng-bind-html="i.unicode|html"></option>

AngularJS Select - 自动 select 选项

AngularJS Select - Automatically select option

angularjs

font-awesome

drop-down-menu