Question

我是angularjs的新手，我希望基于城市选择的城市ID，在用户开始时输入框中输入任何调用API的字符，根据结果i显示在datalist中填充所有城市名称。 City id也在响应对象（JSON对象）中。它工作正常，但我需要特定城市的城市ID。我不知道如何实现这一点。任何帮助都很明显。

我的HTML：

<input type="text" list="cityList"  placeholder="Select City from name " ng-model="selectcity" ng-keyup="selCity()"  id="seacityincoucat" />
  <datalist id="cityList">
     <option ng-repeat="city in cities" value="{{city.name}}">
  </datalist>

我的控制器：

$scope.selCity = function () {
        var ciseurl = EF_CONS.ALL_CITY_POINT + $scope.selectcity;
        $http.get(ciseurl, config).then(function (response) {
            $scope.cities = response.data.results;

        });
    };

回复：

{
    "httpHeaders": {
        "message": "cities found : 9"
    },
    "metadata": null,
    "results": [
        {
            "source": "Self",
            "id": 12,
            "name": "Bareilly",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 13,
            "name": "Belgaum",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 14,
            "name": "Bengaluru",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 15,
            "name": "Berhampur",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 16,
            "name": "Bhilai",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 17,
            "name": "Bhopal",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 18,
            "name": "Bhubaneswar",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 19,
            "name": "Bhusaval",
            "code": null,
            "active": false
        },
        {
            "source": "Self",
            "id": 20,
            "name": "Bilaspur",
            "code": null,
            "active": false
        }
    ],
    "singleResult": null,
    "status": "$200",
    "count": null
}

Answer 1

If i'm not wrong

In your html add the following event and options to the input load all the cities data on page load and take all data into $scope.cities your problem will solve.

  ng-model="selectcity" ng-model-options="{ debounce: 1000 }" ng-change="getObjData(selectcity)

Like below

<input type="text" list="cityList"  placeholder="Select City from name" ng-model="selectcity" ng-model-options="{ debounce: 1000 }" ng-change="getObjData(selectcity);"   id="seacityincoucat" />

In your controller

 $scope.getObjData = function(name){
    for(var i=0;i<$scope.cities.length;i++){
        if($scope.cities[i].name.toLowerCase() == name.toLowerCase()){
            console.log($scope.cities[i]);  //ouput will prints the selected city object data
            break;
        }
    }
 };

如何根据城市选择获得cityid

1 个答案: