在点击AngularJS时发出新的AJAX请求

Make new AJAX request on ng-click AngularJS

本文关键字：AJAX 请求 AngularJS      更新时间：2023-09-26

我为inputCity的天气搜索做了这个HTML，当它返回一个数组时，我想让人们从列表中选择：

    <form class="form-container" ng-submit="submitForm(inputCity)">
        <input class="input-field" type="text" ng-model="inputCity" placeholder="City">
        <input class="button-style" type="submit" value="Show Weather">
    </form>
    <table class="cities-table" ng-if="isArray">
        <tr ng-repeat="data in cityArray" ng-click="inputCity=='zmw:{{data.zmw}}'">
            <td>{{data.city}} in {{data.country_name}}</td>
        </tr>
    </table>

我的js文件：

.controller('WeatherController', [
    '$scope',
    'Weather',
    function($scope, Weather) {
        /* TODO: implement */
        $scope.weatherData = [];
        $scope.submitForm = function(inputCity){
            Weather.getWeather(inputCity).success(function(data){
                $scope.isArray = angular.isArray(data.response.results);
                $scope.cityArray = data.response.results;

以及工厂中的链接：

        getWeather : function(inputCity) {
            return $http({
                url: 'http://api.wunderground.com/api/KEY/conditions/q/' + inputCity + '.json',
                method: 'GET'
            })
        }

当数组出现时，我可以在ng-click上这样做吗？它选择一个城市名称（人们可以在搜索字段中使用zmw:｛｛data.zmw｝｝而不是inputCity或真实的城市名称，因为该信息随数组一起出现）并发送AJAX请求？

更清楚：

我制作了一个表格，输入（应该写在哪里的城市名称）和一个搜索按钮。单击按钮后，下面会显示天气信息。但当人们在一个城市键入时，这并不是世界上唯一一个同名的城市，比如旧金山（其中有10个，在阿根廷、美国等地），天气API会返回所有可能的城市的数组，而不是天气信息。我做到了这一点，如果返回数组，它将显示API返回的所有城市。我现在想做的是，当人们点击显示的城市之一时，ng-click会触发相同的AJAX调用，但具有良好的搜索输入（zmw:｛｛data.zmw｝｝工作正常）。也许我应该为此做另一个函数，但它显示了一些错误？

您可以通过更改这一行来获得触发AJAX调用的点击事件

<tr ng-repeat="data in cityArray" ng-click="inputCity=='zmw:{{data.zmw}}'">

带有

<tr ng-repeat="data in cityArray" ng-click="submitForm('zmw:' + data.zmw)">
相关文章：