Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了angularjs – 我如何观看Angular-ui的新ui-select(前ui-select2)搜索字符串更改?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我注意到Angular-UI已经停止了他们的UI-SELEct2指令,有利于新的UI-SELEct(具有多个主题SELEct2,bootstrap,SELEctizE).

看起来像这样

<ui-SELEct multiple ng-model="multipleDemo.colors" theme="SELEct2" ng-disabled="disabled" style="width: 300px;">
    <ui-SELEct-match placeholder="SELEct colors...">{{$item}}</ui-SELEct-match>
    <ui-SELEct-choices repeat="color in availableColors | filter:$SELEct.search">
        {{Color}}
    </ui-SELEct-choices>
</ui-SELEct>

<p>SELEcted: {{multipleDemo.colors}}</p>

最初,我的选择框应该是空的,但是可以使用打字字符,这是一个至少4个字符的字符串,然后进行API调用来检索要填充框的建议值列表.然后选择一个值,并根据需要重复搜索.

首先,我尝试$观看ng模型,在这种情况下,这是多个Demo.colors(使用这个示例从演示). API调用从未发生,然后我意识到为什么.实际的模型根本没有改变,因为只有当选择时才会改变(我的选择框为空,所以没有任何选择).

我的结论是,我应该(能够)$看什么被添加为过滤器,即过滤器:$SELEct.search.

有谁知道我应该在我的控制器中使用那个?

这个:

$scope.$watch('$SELEct.search',function(newVal){
    alert(newVal);
});

不行

编辑:
对于任何人的参,请参阅这个简短的讨论:Is it possible to add support for custom query function like the select2?

编辑2:

通过使用指令中的$emit来解决这个问题,所以我的控制器现在可以使用这个值.但是现在我想知道如何覆盖该指令的这一部分,因此指令本身可以保持原样,以便将来的更新不会中断?

使用< ui-SELEct-choices>上的refresh属性元素使用$SELEct.search作为参数来调用范围的函数
<ui-SELEct-choices repeat="color in multipleDemo.availableColors | filter:$SELEct.search"
                   refresh="refreshColors($SELEct.search)"
                   refresh-delay="0">
    {{Color}}
</ui-SELEct-choices>

然后使用函数(这个代码段中的refreshColors())相应地更新multipleDemo.availableColors.

您还可以使用refresh-delay属性来指定去抖动函数的毫秒数,以便快速连续地调用太多次.

我也把可用的颜色放在multiDemo上,就像你已经为multiDemo.colors所做的那样,就像recommended一样.

ui-select directive wiki下的示例:Async.

大佬总结

以上是大佬教程为你收集整理的angularjs – 我如何观看Angular-ui的新ui-select(前ui-select2)搜索字符串更改?全部内容,希望文章能够帮你解决angularjs – 我如何观看Angular-ui的新ui-select(前ui-select2)搜索字符串更改?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。