角度 ui-select 绑定到一个属性，但向用户显示另一个属性

Angular ui-select Bind to one property, but show to user another

本文关键字：属性 用户 另一个 显示 一个 绑定 ui-select 角度      更新时间：2023-09-26

这是我的html代码：

      <ui-select ng-model="eVisitorGuest.ArrivalOrganization" theme="" name="arrivalOrganization" options="{selectedDisplayProperty:Name}">
                                                <ui-select-match placeholder="Organizacija dolaska">{{$select.selected.CodeMI}}</ui-select-match>
                                                {{$select.selected.Name}}
                                                <ui-select-choices repeat="evisitorArrivalOrganization in evisitorArrivalOrganizations | propsFilter: {Name: $select.search}">
                                                    <div ng-bind-html="evisitorArrivalOrganization.Name  | highlight: $select.Name"></div>
                                                </ui-select-choices>
                                            </ui-select>

我正在保存到数据库 CodeMI 属性 到达组织对象，一切都很好，角度 ui-select 很好地绑定并在下拉列表中选择元素，其 CodeMI 属性已保存到数据库。问题是我不希望 CodeMi 属性给用户，而是另一个 Name 属性。如何实现呢？

假设您的控制器中有以下结构：

 $scope.items = [{ name: 'one',
                   value: 1 },
                 { name: 'two',
                   value: 2 },
                 { name: 'three',
                   value: 3 },
                 { name: 'four',
                   value: 4 }];

并且您只想显示项的名称属性。您可以执行以下操作：

<ui-select ng-model="selected" theme="bootstrap" title="Choose Name...">
  <ui-select-match>{{$select.selected.name}}</ui-select-match>
  <ui-select-choices repeat="item.value as item in items track by $index | filter: $select.search">
    <div ng-bind-html="item.name"></div>
  </ui-select-choices>
</ui-select>

现在，下拉列表将显示名称，但是当您选择一个名称时，您的$scope.selected将具有所选项目的值。

我知道我的答案"有点"晚了，但我希望有人会发现它有用。 :)

相关文章：