Angular UI bootstrap：如何添加第一个选项以进行选择？

Question

我有以下选择架构：

首先：我有输入，它会过滤我的选择 Dropbox 结果

第二：在我的结果中总是应该是选项，当我点击它时，我想看到模态窗口（所以，即使我输入了一些文本，这个选项仍然必须在我的 Dropbox 中）

第三...n：默认选项

现在我有了这样的模板：

<ui-select ***mysecretoptions***>
  <ui-select-match ***mysecretoptions***>***mysecretoptions***</ui-select-match>

  <ui-select-choices***mysecretoptions***>
    <span ***mysecretoptions***></span>
  </ui-select-choices>
</ui-select>

而且效果很好，但是当我进行一些搜索时，第一个选项会隐藏...

有可能吗，怎么做？

只有当我输入/单击 ui-select 时才会显示第一个选项（因此它不会显示为选中或整个选择框的默认值）

Answer 1

是的，有可能，我每天都这样做，请检查以下内容：

<ui-select ng-model="view.provinceCode" title="Province">
    <ui-select-match placeholder="Select...">{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat="x.code as x in view.provinces | filter: $select.search">
        <div ng-bind-html="x.name | highlight: $select.search"></div>
    </ui-select-choices>
</ui-select>

正如您在repeatline 中看到的那样，您可以使用对象数组的任何属性作为ng-model 的值，一旦您这样做了，您就可以手动设置所选项目。

// my controller (javascript)
view.provinceCode = 37;

这会将ui-select 设置为您在控制器中建立的项目。

如果不使用x.property as x 近似，如果将模型设置为FULL 对象，结果将是相同的：ui-select 的 selected 属性将是你想要的。

编辑：

我刚刚意识到您要求将数组的 first 元素放入，在您的情况下这更容易......

view.provinceCode = view.provinces[0].code;

或者，使用完整的对象...

view.selectedProvince = view.provinces[0];