输入框在AngularStrap中不起作用选择自定义模板

Question

我为AngularStrap Select指令创建了一个自定义模板，但由于某种原因，我无法输入我添加到模板的文本框内部。我想使用此文本框来过滤列表项。

自定义HTML模板（/dist/select.html）

我在默认模板中添加的唯一内容是包含文本框的另一个<li>元素。换句话说，我基本上复制＆amp;粘贴了默认模板，并添加了<li>和<input>元素。

<ul tabindex="-1" class="select dropdown-menu" ng-show="$isVisible()" role="select">
    <li>
        <input type="text" class="form-control input-sm" ng-model="iconFilter" />
    </li>
    <li ng-if="$showAllNoneButtons">
        <div class="btn-group" style="margin-bottom: 5px; margin-left: 5px">
            <button class="btn btn-default btn-xs" ng-click="$selectAll()">All</button>
            <button class="btn btn-default btn-xs" ng-click="$selectNone()">None</button>
        </div>
    </li>
    <li role="presentation" ng-repeat="match in $matches" ng-class="{active: $isActive($index)}">
        <a style="cursor: default;" role="menuitem" tabindex="-1" ng-click="$select($index, $event)">
            <i class="{{$iconCheckmark}} pull-right" ng-if="$isMultiple && $isActive($index)"></i>
            <span ng-bind="match.label"></span>
        </a>
    </li>
</ul>

HTML

这是包含对bs-select指令的调用的实际HTML。

<button ng-if="path() === '/contacts/people'"
    type="button"
    class="btn btn-default btn-sm"
    ng-model="selectedIcon"
    data-html="1"
    data-multiple="1"
    data-template="/dist/select.html"
    ng-options="icon.value as icon.label for icon in getIcons()"
    bs-select>
        Action <span class="caret"></span>
</button>