使用angular-ui bootstrap typeahead如何从json获取值以输入两个不同的输入标记

时间:2014-06-22 13:57:28

标签: json angularjs angular-ui-bootstrap

我已经在输入标记中的json文件中完成了自动完成,json文件有多个属性,我想要一个单独的输入从json文件中携带不同的属性,例如:一个输入应该获取“driver_name”和其他应该获取“vehicle_number”,一旦我们从第一个输入标签中选择数据,第二个输入标签需要自动填充

[
{
"id": 1,
"driver_name": "Rohit",
"driver_phone": "9176649143",
"vehicle_type": "indica",
"vehicle_number": "TN 06 AR 4556"
},
{
"id": 2,
"driver_name": "john",
"driver_phone": "9176648143",
"vehicle_type": "fiat",
"vehicle_number": "CA 06 AR 4556"
}
]

HTML

<div ng-controller="TypeaheadCtrl">
    <div class="input-group m-bot15">
      <input ng-model="tripsheet.vehicle_no" type="text" class="form-control input-lg" placeholder="Vehicle No" typeahead="Unidade.vehicle_number as Unidade.vehicle_number for Unidade in getUnidades($viewValue)"> 
    </div>

    <div class="input-group m-bot15">
      <input ng-model="tripsheet.driver_name" type="text" class="form-control input-lg" placeholder="Vehicle No" typeahead="Unidade.driver_name as Unidade.driver_name for Unidade in getUnidades($viewValue)"> 
    </div>
</div>

JS

function TypeaheadCtrl($scope, $http) {

 $scope.Selected = undefined;
 $scope.getUnidades = function($viewValue) {
    return $http.get(urldr + '/all').then(function(response){
      return response.data;
    });
 };
}

1 个答案:

答案 0 :(得分:0)

应该只能在预先输入功能中添加一个过滤器:

$scope.getUnidades = function($viewValue, filter) {
    return $http.get(urldr + '/all').then(function(response){
        var values = [];
        for (var i = 0; i < response.data.length; i++) {
            if (response.data[i][filter].indexOf($viewValue) > -1) 
                values.push(response.data[i])
        }
        return values;
    });
};

filter是要在

上过滤的属性名称