Question

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

 <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);
    });
};

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

图像显示选择印度国家和Maharastra状态作为回应，但选择美国只是为了更改响应给出错误

Answer 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。

Answer 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>

第二次更改下拉框时出错

2 个答案: