angular-ui-select - 如何将对象属性绑定到 ng-model [英] angular- ui-select - how to bind object property to ng-model
问题描述
我在一个简单的用户注册表中使用 angular-ui-select:
i'm using the angular-ui-select in a simple user registration form:
<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>
这是我的国家/地区数组定义:
Here's my countries array definition:
$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 之类的简单输入时,这很容易:
I'm creating the user object in my html, every field had an ng-model binded to some property of the user. When i'm using simple input such as firstName then it's easy:
<input class="form-control" type="text" name="firstName" ng-model="user.firstName"/>
但是随着下拉菜单 -我希望国家名称显示在下拉列表选项中,并将其代码放置在用户对象中.我想避免为此在控制器中编写代码.(即 $scope.user.countryCode = $scope.country.selected.code; )
But with the dropdown - I want the country name to be displayed in the dropdown list options and the its code to be placed in the user object. I want to avoid writing code in the controller for this. (i.e. $scope.user.countryCode = $scope.country.selected.code; )
推荐答案
我认为你可以:
<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 card">
.
In the repeat of the ui-select-choices identify the property you are wanting to bind to; repeat="item.id as item in cards">
.
这篇关于angular-ui-select - 如何将对象属性绑定到 ng-model的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!