angular ui-typeahead建议+如果没有结果,请保留

时间:2021-11-09 19:37:49

Controller

 $scope.log = function(value) {
        console.log(value);
    }
 $scope.customers = array....

View

 <script type="text/ng-template" id="customPopupTemplate.html">
    <ul class="dropdown-menu" ng-show="isOpen() && !moveInProgress" ng-style="{top: position().top+'px', left: position().left+'px'}" style="display: block;" role="listbox" aria-hidden="{{!isOpen()}}">
        <li ng-repeat="match in matches track by $index" ng-class="{active: isActive($index) }" ng-mouseenter="selectActive($index)" ng-click="selectMatch($index)" role="option" id="{{::match.id}}">
            <div uib-typeahead-match index="$index" match="match" query="query" template-url="templateUrl"></div>
        </li>

        <button type="button" class="btn btn-success"  ng-click="$parent.$parent.log(query);">Post</button>
       input: {{query}}
    </ul>

</script>
     <div class="form-group">
                                <input placeholder="Vælg kunde" type="text" ng-model="customer"  typeahead-editable="false" uib-typeahead="customer as customer.customer for customer in customers | filter:$viewValue | limitTo:8" class="form-control"
                                       typeahead-popup-template-url="customPopupTemplate.html"  >
                            </div>

When i input to typeahead, and there is no result the dropdown box disappear how can i get i to stay

当我输入到typeahead,并且没有结果下拉框消失时我怎么能让我留下来

also wondering on how to make typeahead auto suggestions, show when click on input box it will show dropdown with etc. first 5 in list.

还想知道如何制作打字自动建议,显示当点击输入框时,它将显示下拉列表中的第5个列表。

1 个解决方案

#1


0  

Directive uib-typeahead-popup has an isolated scope. This means that you cannot use any scope variables in the template, other than explicitly defined in the isolated scope of that directive. What you want is not possible using this particular directive, unless you apply a very dirty trick, e.g. add a property to the customer object:

指令uib-typeahead-popup具有独立的范围。这意味着除了在该指令的隔离范围中明确定义之外,您不能在模板中使用任何范围变量。使用这个特定的指令是不可能的,除非你应用一个非常脏的技巧,例如向客户对象添加属性:

for (var i=0; i<customers.length; i++) {
    customers[i].whatadd = "something";
}

and then you can use the following in your template:

然后您可以在模板中使用以下内容:

<a href="">+ add {{matches[0].whatadd}}....</a>

If you don't like dirty tricks, then you will have to write your own typeahead directive that does not have an isolated scope or allows you to specify the addition as an extra attribute.

如果您不喜欢脏技巧,那么您将不得不编写自己的typeahead指令,该指令没有隔离范围,或者允许您将添加指定为额外属性。

#1


0  

Directive uib-typeahead-popup has an isolated scope. This means that you cannot use any scope variables in the template, other than explicitly defined in the isolated scope of that directive. What you want is not possible using this particular directive, unless you apply a very dirty trick, e.g. add a property to the customer object:

指令uib-typeahead-popup具有独立的范围。这意味着除了在该指令的隔离范围中明确定义之外,您不能在模板中使用任何范围变量。使用这个特定的指令是不可能的,除非你应用一个非常脏的技巧,例如向客户对象添加属性:

for (var i=0; i<customers.length; i++) {
    customers[i].whatadd = "something";
}

and then you can use the following in your template:

然后您可以在模板中使用以下内容:

<a href="">+ add {{matches[0].whatadd}}....</a>

If you don't like dirty tricks, then you will have to write your own typeahead directive that does not have an isolated scope or allows you to specify the addition as an extra attribute.

如果您不喜欢脏技巧,那么您将不得不编写自己的typeahead指令,该指令没有隔离范围,或者允许您将添加指定为额外属性。