从url json中获取数据不工作
Typeahead fetch data from url json value not working
下面是我的HTML代码angular typeahead:
<div class="form-group">
<select name="" class="form-control" ng-model="city" ng-change="onChange(e)" id="city">
<option value="DELHI">DELHI</option>
<option value="BANGALORE">BANGALORE</option>
<option value="GOA">GOA</option>
<option value="KOLKATA">KOLKATA</option>
<option value="PUNJAB">PUNJAB</option>
</select>
</div>
<input type="search" name="" ng-model="bankName" typeahead='bank_name as bankName | filter:$viewValue | limitTo:8' id="input" class="form-control" value="" placeholder="Search" required="required" title="">
<table class="table table-hover">
<thead>
<tr>
<th>IFSC</th>
<th>BANK ID</th>
<th>BANK NAME</th>
<th>BRANCH</th>
<th>ADDRESS</th>
<th>CITY</th>
<th>DISTRICT</th>
<th>STATE</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="service in services">
<td>{{service.ifsc}}</td>
<td>{{service.bank_id}}</td>
<td>{{service.bank_name}}</td>
<td>{{service.branch}}</td>
<td>{{service.address}}</td>
<td>{{service.city}}</td>
<td>{{service.district}}</td>
<td>{{service.state}}</td>
</tr>
</tbody>
</table>
下面是JS文件:
var app = angular.module('bankBranch', ['ui.bootstrap'])
.controller('ServicesCtrl', ['$scope', '$http', function($scope, $http){
$scope.bankUrl = "https://someweb.com/api/bank_branches?offset=0&limit=50&city=";
$scope.city = 'BANGALORE';
var bankName = '$scope.bank_name';
var cities = '$scope.city';
$scope.getdata = function(){
$http.get($scope.bankUrl+$scope.city).then(function(response){
$scope.services = response.data;
});
}
$scope.onChange = function(e){
$scope.getdata();
}
$scope.getdata();
}]);
问题是我试图在输入字段中获取分支名称,当我键入下面的表数据时,应该根据该数据进行过滤。onChange函数正在为选择框工作。api url的JSON格式如下:
[{
"ifsc": "asdads",
"bank_id": 110,
"bank_name": "abc bank",
"branch": "BANGALORE",
"address": "ewrwerewr",
"city": "BANGALORE",
"district": "BANGALORE URBAN",
"state": "KARNATAKA"
}]
知道如何修改这个吗?越来越困。
您在使用typeahead指令时犯了错误,它的工作方式是,它需要一个承诺对象,您将在其上应用$viewValue
过滤器
<input type="search" name="" ng-model="bankName"
typeahead='bank_name for bankName in getdata()'
id="input" class="form-control" value=""
placeholder="Search" required="required" title=""/>
让我们改变你的$scope.getData
函数从它返回承诺对象。
$scope.getdata = function(){
return $http.get($scope.bankUrl+$scope.city).then(function(response){
$scope.services = response.data;
return $scope.services;
});
}
$scope.onChange = function(e){
return $scope.getdata();
}
注意:如果你使用的是Angular ui-bootstrap版本1。X+然后你必须在每个ui引导指令之前使用
uib-
前缀,就像在你的情况下,它将是uib-typeahead
而不是typeahead
。
相关文章:
- 数据属性仅在切换设备模式下工作
- OnsenUI AngularJS数据绑定无法正常工作
- 将数据输入到draggable无法工作
- 当单元格内容由于forumula从另一个工作表编译数据而更改时发送电子邮件
- 数据rel=“;背面“;无法在iPhone上工作
- Ember数据:如何;映射”;工作
- Ajax表单数据phpPOST不工作
- 我应该将哪些数据传递给 Spotify 应用程序才能使分页工作
- 数据表 + 列搜索 + 整体搜索协同工作 + 服务器端处理
- .split() 数据属性在应该工作的时候不起作用
- 与 Angular 1.5 的单向数据绑定类似于双向工作
- 数据表自动生成的序列号无法正常工作.对于每一页
- 数据表中的FixedHead没有'删除分页后无法工作
- 谷歌脚本-从网站论坛解析HTML-并将数据写入工作表
- 如何使用应用程序脚本执行API从谷歌工作表中提取数据
- 按钮上的数据加载消息无法与ajax调用一起工作
- Ember数据:DS.attr(“数字”)应该如何工作
- 使模糊算法与画布图像数据工作
- 图表JS不与动态数据工作
- 与嵌入式记录和烬数据工作