第二次更改下拉框时出错答案

【问题标题】：Getting error when changing a dropdown box for second time第二次更改下拉框时出错
【发布时间】：2017-01-16 11:12:45
【问题描述】：

所以我有两个下拉框，第一个下拉框响应是在加载页面时生成的，第二个下拉框响应是在更改第一个下拉响应时生成的

 <div class="form-group">
    <select name="country_city" class="inputbox" required ng-model="frm.country_city" ng-change="state_city()">
        <option ng-repeat="country in country_city track by $index" value="{{country.id}}">{{country.name}}</option>
    </select>
</div>

<div class="form-group">
    <select name="state_city" class="inputbox" required ng-model="frm.state_city">
        <option ng-repeat="state in state_city track by $index" value="{{state.id}}">{{state.name}}</option>
    </select>
</div>

$scope.state_city = function() {
    console.log("in state city");
    $scope.frm.country_city;
    $http.get(url, {
        params: {
            action: 'get_state_city',
            country_id: $scope.frm.country_city
        }
    }).success(function(data, status, headers, config, jsonp) {
        $scope.state_city= data;
        console.log($scope.state_city);
    });
};

问题是，当我第二次更改第一个下拉框的响应时，它给了我一个错误。这些图像是有帮助的。第三张图片显示错误

图片显示印度国家和玛哈斯特拉州的选择作为响应，但在选择美国只是为了改变响应给出错误

【问题讨论】：

哇，您有 8000 多封未读电子邮件。不要这样放图片。
您确定 html 已正确映射到您拥有该功能的控制器吗？
@sreehari thik 所以因为它第一次可以正常工作
@sreehari 你还有什么建议
你能检查一下 $scope.state_city = function() { console.log("in state city");} 将 console.log 单独放在你的函数中，看看它是否被多次调用。 .. 删除 state_city 中的其他代码

标签： jquery html angularjs drop-down-menu

【解决方案1】：

问题是您的scope function 名称和scope variable name 相同：

$scope.state_city = function() {
    console.log("in state city");
    $scope.frm.country_city;
    $http.get(url, {
        params: {
            action: 'get_state_city',
            country_id: $scope.frm.country_city
        }
    }).success(function(data, status, headers, config, jsonp) {
        $scope.state_city= data; => Issue is here
        console.log($scope.state_city);
    });
};

你正在创建一个函数$scope.state_city()，然后在你的成功函数中你正在这样做$scope.state_city= data;，从下一次你的state_city变成variable和response data，不再是function。

【讨论】：

是的，感谢@Thalaivar 的回复，你真的不了解我
@SnehalGongle：没关系......它发生了快乐的编码:)

【解决方案2】：

尝试更改为：

 $scope.change_state_city = function() {
            $http.get(url, {
            params: {
                action: 'get_state_city',
                country_id: $scope.frm.country_city
            }
        }).success(function(data, status, headers, config, jsonp) {
            $scope.state_city= data;
            console.log($scope.state_city);
        });
    };

<div class="form-group">
    <select name="country_city" class="inputbox" required ng-model="frm.country_city" ng-change="change_state_city()">
        <option ng-repeat="country in country_city track by $index" value="{{country.id}}">{{country.name}}</option>
    </select>
</div>

<div class="form-group">
    <select name="state_city" class="inputbox" required ng-model="frm.state_city">
        <option ng-repeat="state in state_city track by $index" value="{{state.id}}">{{state.name}}</option>
    </select>
</div>

【讨论】：