UIS选择默认选项/选项

Question

我必须在 Uiselect 中有一个默认选项/选择（如"单击以做某事"），我将从服务推送的数据绑定到该选项/选项并刷新（当用户键入某些内容时，根据用户输入从服务中获取数据。

我当前的UISelect实现是这样的

<ui-select id="agencySelect" class="form-control" ng-model="selectedAgencies.selectedAgency" theme="select2" on-select="onAgencySelected()" ng-disabled="disabled" required autofocus>
    <ui-select-match >{{$select.selected.Name}} ({{$select.selected.AgencyKey}})</ui-select-match>
    <ui-select-choices refresh="funcAsync('Agencies',$select.search)" refresh-delay="0" repeat="agency in agencies | filter:$select.search">
        <div>{{agency.Name}} ({{agency.AgencyKey}})</div>
    </ui-select-choices>
</ui-select>

我想始终向用户添加一个默认选项，例如"单击以执行某些操作"，无论过滤数据源如何，这始终向用户显示。

我们可以有这样的东西吗？

     <ui-select id="agencySelect" class="form-control" ng-model="selectedAgencies.selectedAgency" theme="select2" on-select="onAgencySelected()" ng-disabled="disabled" required autofocus>
    <ui-select-match >{{$select.selected.Name}} ({{$select.selected.AgencyKey}})</ui-select-match>        
    <ui-select-choices null-label="Click to do something" refresh="funcAsync('Agencies',$select.search)" refresh-delay="0" repeat="agency in agencies | filter:$select.search">
        <div ng-trim="false">{{agency.Name}} ({{agency.AgencyKey}})</div>
    </ui-select-choices>
</ui-select>

现在我正在这样做

<ui-select-choices refresh="funcAsync('Agencies',$select.search)" refresh-delay="0" repeat="agency in agencies | filter:$select.search">
        <div >{{agency.Name}} ({{agency.AgencyKey}})</div>
    </ui-select-choices>
</ui-select>

我想做什么

    <ui-select-choices null-label="Click to do something" refresh="funcAsync('Agencies',$select.search)" refresh-delay="0" repeat="agency in agencies | filter:$select.search">
        <div>{{agency.Name}} ({{agency.AgencyKey}})</div>
    </ui-select-choices>
</ui-select>

以使此默认选项始终可供用户使用，尽管进行了筛选。

注意：我可以做的一种方法是将此"单击以执行某些操作"选项始终作为第一项添加到数据源中，但我不想每次用户过滤或尝试从服务器获取数据时弄乱源。

感谢您的帮助。

Answer 1

只需将占位符属性添加到UI-select-match指令中即可

<ui-select ng-model="address.selected"
         theme="bootstrap"
         ng-disabled="disabled"
         reset-search-input="false"
         style="width: 300px;">
<ui-select-match placeholder="Enter an address...">{{$select.selected.formatted_address}}</ui-select-match>
<ui-select-choices repeat="address in addresses track by $index"
         refresh="refreshAddresses($select.search)"
         refresh-delay="0">
  <div ng-bind-html="address.formatted_address | highlight: $select.search"></div>
</ui-select-choices>

实际上这段代码来自它自己看到的 UI-select git 存储库的演示扑通克