如何使用本地json文件jquery或angularjs实现文本框的自动完成

How to Implement autocomplete for a textbox using local json file jquery or angularjs

本文关键字：文本 实现 angularjs 何使用 json 文件 jquery      更新时间：2023-09-26

这里我想开发公交订票网站，我想在用户键入时显示城市。我试过很多文章，他们都调用远程api来获取数据。但我不知道如何从本地json获取数据。我已经完成了它的自动完成扩展程序从服务器的数据在asp.net。现在我想用jquery为本地json文件

这是我的json文件: 
{"stationList":[{"stationName":"10 dol","stationId":-1},{"stationName":"Adduroad","stationId":4508},{"stationName":"Adilabad","stationId":4198},{"stationName":"Adoni","stationId":2893},{"stationName":"Afzulgunj","stationId":-1},{"stationName":"Agaratala","stationId":-1},{"stationName":"Agartala","stationId":-1},{"stationName":"Agra","stationId":2486},{"stationName":"Ahmedabad","stationId":2434},
"apiStatus":{"success":true,"message":"SUCCESS"}}

我不知道如何在jquery或angularjs中实现，我在互联网上找到了许多文章jQuery自动完成使用本地json文件?自动完成文本框和angularjs

我会使用angular ui-select。它提供了非常灵活的搜索和显示。您可以使用本地数据或从$http get:

中检索数据。

http://plnkr.co/edit/juqoNOt1z1Gb349XabQ2?p =

预览
  <h3>Array of objects with single property binding</h3>
  <ui-select multiple ng-model="multipleDemo.selectedPeopleSimple" theme="select2" ng-disabled="disabled" style="width: 800px;">
    <ui-select-match placeholder="Select person...">{{$item.name}} &lt;{{$item.email}}&gt;</ui-select-match>
    <ui-select-choices repeat="person.email as person in people | propsFilter: {name: $select.search, age: $select.search}">
      <div ng-bind-html="person.name | highlight: $select.search"></div>
      <small>
        email: {{person.email}}
        age: <span ng-bind-html="''+person.age | highlight: $select.search"></span>
      </small>
    </ui-select-choices>
  </ui-select>
  <p>Selected: {{multipleDemo.selectedPeopleSimple}}</p>
相关文章：