0

我必须在 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>

尽管过滤，用户始终可以使用此默认选项。

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

感谢你的帮助。

4

1 回答 1

0

很简单，只需将占位符属性添加到 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 repo 的演示，它自己看 plunk

于 2015-03-23T16:34:41.407 回答