angular- UI的选择 - 如何对象的属性绑定到NG-模型 [英] angular- ui-select - how to bind object property to ng-model

查看:512
本文介绍了angular- UI的选择 - 如何对象的属性绑定到NG-模型的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的是棱角分明的UI选在一个简单的用户注册表单:

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>

下面是我的国阵定义:

$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-模式绑定到用户的某些属性。当我使用简单的输入,如随后的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"/>

但随着下拉 -
我要显示在下拉列表中选择国家名和其code被放置在用户对象。
我想避免写code控制器这一点。 (即$ scope.user.country code = $ 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 /维基/ UI的选择,选择

在UI的选择,选择的重复鉴定你是想绑定到财产; 重复=卡item.id为项目&GT;

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的选择 - 如何对象的属性绑定到NG-模型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆