javascript - AngularJS:使用 ui-select 时如何选择对象字段?

标签 javascript angularjs angular-ui

我想将此 HTML 选择转换为 angular-ui/ui-select语法:

<select ng-model="person.email" ng-options="p.email as p.name for p in people"></select>

我怎样才能让 ng-model 成为人的电子邮件? ng-options 语法(“p.email as p.name for p in people”)不适用于 ui-select repeat。

我已经设法让 ui-select 选择正确的人物对象。但我只对电子邮件领域感兴趣。

<ui-select ng-model="person.email" theme="bootstrap">
    <ui-select-match placeholder="Choose">{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat="person in people">
      <div ng-bind-html="person.name | highlight: $select.search"></div>
    </ui-select-choices>
  </ui-select>

Controller 中的人物对象:

$scope.people = [
    { name: 'Adam',      email: 'adam@email.com',      age: 10 },
    { name: 'Amalie',    email: 'amalie@email.com',    age: 12 }
];

以上代码演示:Plunker

最佳答案

请看演示:http://plnkr.co/edit/InfxSo?p=preview

<body ng-controller="DemoCtrl">
    <p>Selected: {{person.email}}</p>
    <ui-select ng-model="$parent.person" theme="bootstrap">
        <ui-select-match placeholder="Choose">{{$select.selected.name}}</ui-select-match>
        <ui-select-choices repeat="person in people">
            <div ng-bind-html="person.name"></div>
        </ui-select-choices>
    </ui-select>
    <br>
    <br>
    <!-- This is what i want to do -->
    <!--<select ng-model="person.email" ng-options="p.email as p.name for p in people">

          </select>>-->
</body>

关于javascript - AngularJS:使用 ui-select 时如何选择对象字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26146415/

相关文章:

javascript - 使用 reduce 的数组输出的特定键的累积和

javascript - 如何在 preventDefault 之后创建粘贴事件?

javascript - AngularJS - 更改 iframe 或类似内容中的内容

javascript - Karma-Jasmine:意外的请求:GET…预期没有其他请求

google-maps - 在 AngularJS 中使用所有谷歌地图 API 功能

javascript - 如何使用 AngularJS 从自定义 URL 获取字体?

javascript - Angular UI Sortable 无法正常工作

JavaScript 爱尔兰语移动正则表达式

AngularJS:使用不同的 ng-app 指令在不同页面的 Controller 之间传递数据

javascript - 如何用 Jasmine 部分检查对象