如何使用onsen-ui的自动完成功能？

Question

我正在ui开发一个带有Onsen-ui的移动应用程序，它是AngularJS上的built，我不熟悉。我想在搜索栏上使用远程自动完成功能，并用结果填充 ons-list。

我浏览了文档，但找不到与自动完成相关的任何内容，只有 ons-lazy-repeat 很好，但无法使用搜索输入过滤结果。

我知道我可以使用 jQuery 或 jQuery Mobile，但是在导入 required 文件后我仍然收到错误：'autocomplete is not a function'，页面将不会显示任何 jQuery 移动元素。

这些是我的进口货：

<link rel="stylesheet" href="components/loader.css">
<link rel="stylesheet" href="css/style.css">  

<script src="components/monaca-onsenui/js/onsenui_all.min.js"></script>
<link rel="stylesheet" href="components/monaca-onsenui/css/onsen-css-components.css">

<script src="components/monaca-jquery/jquery.js"></script>
<script src="components/monaca-jquery-mobile/jquery.mobile.js"></script>
<link rel="stylesheet" href="components/monaca-jquery-mobile/css/jquery.mobile.structure.css">

<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<script src="js/app.js"></script>

有什么方法可以让 jQuery UI 或 jQuery Mobile 与 Onsen-ui 一起工作，或者使用 AngularJS 或创建自动完成以任何方式？

Answer 1

相信我，没那么复杂。

首先，您不需要 jQuery。 jQuery 手机连 Onsen 都用不了UI。

看看这个link：http://www.gajotres.net/ionic-framework-tutorial-5-master-detail-pattern/

披露这是我的个人博客post。您会找到一个简单的示例，向您展示如何在 OnsenUI.

中使用主从模式

您应该对该文章的第一部分感兴趣。

在其中，我使用远程 API 来收集远程数据并将它们显示在列表组件中。从根本上说，您在搜索框中输入的任何内容都会 return 作为过滤结果集。

P.S.

您不能将 jQuery Mobile 与 OnsenUI 一起使用，它们都是移动 UI 框架。永远不要把它们混在一起，没有意义。

虽然 OnsenUI 支持 jQuery 尽量少用它。 OnsenUI 是为与 AngularJS 一起工作而建造的，所以这是你应该学习的。

我的建议，看这个：https://www.youtube.com/watch?v=TRrL5j3MIvo。看完那个视频你会忘记所有关于 jQuery 的事情。

如何使用onsen-ui的自动完成功能？

How to use autocomplete with onsen-ui?

javascript

jquery

autocomplete

jquery-mobile

onsen-ui