Angular UI bootstrap：如何添加第一个选项来选择？

Question

我有以下选择架构：

首先：我有输入，过滤我的选择保管箱结果

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

第三...... 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>

正如您在repeat行中所看到的，您可以使用对象数组的任何属性作为ng-model的值，一旦完成，您就可以设置所选项目手动

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

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

如果您不使用x.property as x近似值，如果将模型设置为 FULL 对象，结果将是相同的：{{的{selected}属性1}}将是你想要的那个。

修改

我刚才意识到你要求放置数组的第一个元素，在你的情况下更容易......

ui-select

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

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