javascript - 如何为angular ui-select设置默认值

标签 javascript angularjs ui-select2 ui-select

问题:

如何为 Angular ui-select 设置默认值

下拉值是从对象中获取的,对象不会有默认值。

并且 ui-select 应该在前端设置默认值。

例如:

下拉值如下

1 - 所有水果 2 - 苹果 3 - 香蕉 4 -西瓜

从 2 到 4 的值是从服务器发送的对象派生的。但前端需要设置默认值,即 1 - 所有水果

引用下面通过ui-select2设置的例子如何在ui-select中迁移这个?

<select ng-model="fID" class="select"  ui-select2 data-placeholder="select fruit">
            <option value="">All fruits</option>
            <option ng-repeat="f in frits value="{{f.fID}}">{{f.name}}</option>
        </select>

<ui-select theme="select2" ng-model="fruits.selected">
            <ui-select-match placeholder="select please" allow-clear="false">                    {{$select.selected.name}}
</ui-select-match>
            <ui-select-choices repeat="f in fruits | filter:$select.search">
                <div ng-bind-html="f.name | highlight: $select.search:'underline'"></div>
            </ui-select-choices>
        </ui-select>

http://plnkr.co/edit/a3KlK8dKH3wwiiksDSn2?p=preview https://github.com/angular-ui/ui-select 链接:angular-ui/ui-select

最佳答案

您没有为选项值使用 id 或类似的东西,因此 ui-select 比较对象地址以了解它是否被选中。

var p1 = { name: 'Adam',      email: 'adam@email.com',      age: 10 };
  $scope.person = {selected: p1};
  $scope.people = [
    p1,
    { name: 'Amalie',    email: 'amalie@email.com',    age: 12 },
    { name: 'Wladimir',  email: 'wladimir@email.com',  age: 30 },
    { name: 'Samantha',  email: 'samantha@email.com',  age: 31 },
    { name: 'Estefanía', email: 'estefanía@email.com', age: 16 },
    { name: 'Natasha',   email: 'natasha@email.com',   age: 54 },
    { name: 'Nicole',    email: 'nicole@email.com',    age: 43 },
    { name: 'Adrian',    email: 'adrian@email.com',    age: 21 }
  ];

像这样更改 plunker,您将拥有一个默认的选定值。

要在 View 上设置默认值,您可以使用 ng-init 并将第一个对象设置为选中

关于javascript - 如何为angular ui-select设置默认值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27623490/

相关文章:

javascript - ionic 和 Angular : Toggle CSS throughout the entire app?

gruntjs - 供应商 css 图像在连接和缩小后不可用

javascript - 创建传单标记并通过循环对象列表将它们存储在变量中

angularjs - 在 angularjs 中 ng-repeat 的替代方法是什么?

javascript - 从一个div访问另一个div的ng-model

jquery - Angularjs ui-select2 不会在 ng-repeat 中使用 ui-sortable 进行拖放渲染

angularjs - 如何在 ui-select2 中禁用删除图标

javascript - 在 iframe 中监听鼠标点击和按键事件

javascript - 使用 getPointAtLength() 将圆添加到路径已移动

php - 使用 PHP 扫描目录并在 JavaScript 中使用结果