从多维数组中使用AngularJS自动完成

时间:2014-11-07 08:00:58

标签: angularjs

我使用bootstrap-ui作为自动完成的角度js,我的第一个自动完成文本框是从多维json数组中获取值,为此我在控制器中使用以下代码

'angular.module('ui.bootstrap.demo', ['ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('TypeaheadCtrl', function ($scope, $http) {

    $scope.selected = undefined;
    $scope.Country = [
 { "name": "United Kingdom", "code": "1" },
{ "name": "United States", "code": "2" },
{ "name": "United States Minor Outlying Islands", "code": "3" }
 ];

});'

html代码

<html ng-app="ui.bootstrap.demo">
         <div class='container-fluid' ng-controller="TypeaheadCtrl">
                <h4>Country</h4>
                <pre>{{selected.name | json}}</pre>
                <input type="text" ng-model="selected" placeholder ="Select Country" typeahead="Country as Country.name for Country in Country | filter:$viewValue | limitTo:8" class="form-control">
                <h4>State in {{selected.name }}</h4>
        </html> 

我的问题是,如何将值绑定到另一个使用以下数组的自动完整文本框

 $scope.States = {
        1:[ 'LiverPool',"Manchester","Totenham","Birmingham" ],
        2:['Arizona','Colorado','Florida','New york']
  };

html代码

<input type="text" ng-model="asyncSelected" placeholder="Select State" typeahead="state as state.code for state in States | filter:$viewValue | limitTo:8" typeahead-loading="loadingLocations" class="form-control">

使用上一个文本框中的代码或名称

1 个答案:

答案 0 :(得分:2)

你可以这样做。

<input type="text" ng-model="selectedNumber" ng-disabled="!customSelected" typeahead="state for state in numbers[customSelected.code] | filter:$viewValue" class="form-control"> 这是plnkr