6

我在一个简单的用户注册表单中使用 angular-ui-select：

<ui-select ng-model="user.countryCode" convert-to-string theme="selectize" class="dropdown">
    <ui-select-match placeholder="{{::strings('userDetails.countryPlaceholder')}}">{{$select.selected.name}}
    </ui-select-match>
    <ui-select-choices repeat="country in countries">
        <span ng-bind-html="country.name | highlight: $select.search"></span>
    </ui-select-choices>
</ui-select>

这是我的国家/地区数组定义：

$scope.countries = [
            {name: 'Afghanistan', code: 'AF'},
            {name: 'Albania', code: 'AL'},
            {name: 'Australia', code: 'AU'},
            {name: 'Austria', code: 'AT'},
            {name: 'Azerbaijan', code: 'AZ'},
            {name: 'Belarus', code: 'BY'},
            {name: 'Belgium', code: 'BE'},
            {name: 'Belize', code: 'BZ'},
            {name: 'Benin', code: 'BJ'}
];

我在我的 html 中创建用户对象，每个字段都有一个绑定到用户的某些属性的 ng-model。当我使用简单的输入（例如 firstName）时，这很容易：

<input class="form-control" type="text" name="firstName" ng-model="user.firstName"/>

但是使用下拉菜单 - 我希望将国家名称显示在下拉列表选项中，并将其代码放置在用户对象中。我想避免为此在控制器中编写代码。（即 $scope.user.countryCode = $scope.country.selected.code; ）

4

3 回答 3

15

我认为你可以这样做：

<ui-select-choices repeat="country.code as country in countries">
    <span ng-bind-html="country.name | highlight: $select.search"></span>
</ui-select-choices>

从文档： https ://github.com/angular-ui/ui-select/wiki/ui-select-choices

示例：绑定单个属性

在 ui-select-choices 的重复中，确定您要绑定到的属性；repeat="item.id as item in cards">.

于 2015-06-23T16:27:05.077 回答
0

您可以使用自定义过滤器“透明地”将您的对象转换为数组：

https://code.angularjs.org/1.4.7/docs/error/filter/notarray

https://github.com/petebacondarwin/angular-toArrayFilter

于 2015-10-30T14:24:25.677 回答
-3 
//in your view(aaa.html) part /
<select 
ng-model="Choices" 
ng-options="choice.code as choice.name for choice in countries ">

// 在你的控制文件中 $scope.user.countryCode = "Choices";

于 2015-06-23T16:45:07.710 回答