Question

我的应用程序有两个具有绑定属性的独立选择。我希望用户能够在任一选项上更改所选选项，这将触发一个功能。但是该函数将使用所选选项的值从选择的BOTH发送到$ http调用以进行数据库查询。以下是代码段：

HTML：

<div class="yearFilter">
    <label>Working Year : </label>
    <select ng-model="filterYear" ng-options="year.code as year.code for year in filterYears | unique:'code'" ngclick="setWorkingData({{filterSport}},{{filterYear}})">
    </select>
</div>
<div class="sportFilter">
    <label>Working Sport : </label>
    <select ng-model="filterSport" ng-options="sport.code as sport.desc for sport in filterSports | unique:'code'" ngclick="setWorkingData({{filterSport}},{{filterYear}})"></select>
</div>

JS：

var PermitsCtrl = function ($scope, $http) {
    var init = function() {
        $http({
            ...
        }).success(function(data) {
            ...
            setWorkingData($scope.filterYear,$scope.filterSport);
        }).error(function(error){
            ...
        });
    }
    var setWorkingData = function (year, sport) {
        $http({
            url ....
            ...
            data  : "action=2&year_code="+year+"&sport_code="+sport,
            ...
        }).success(function(data) {
            $scope.workingData = data.workingData;
        }).error(function(error) {
            ...
        });
    }
    init();
}

加载页面后，init（）被成功触发，构建选择选项，然后正确触发setWorkingData（）函数，根据两个选择中的值相应地更改DOM中的其他值（ filterYear和filterSport）由调用init（）函数发送。到目前为止一切都很好。但是，更改任一选择中的值不会触发setWorkingData函数。渲染的html看起来是正确的：

<select ng-model="filterYear" ng-options="year.code as year.code for year in filterYears | unique:'code'" ng-change="setWorkingData(15,FB)" class="ng-valid ng-dirty"><option value="0" selected="selected">14</option><option value="1" selected="selected">15</option></select>

当我在浏览器中更改select的选择选项时，setWorkingData（）函数的参数值在DOM中正确呈现，但两个选择都没有，但是函数永远不会被触发。

Answer 1

setWorkingData()在控制器中使用私有访问权限定义。为了能够从视图中访问它，必须在范围内声明它：

$scope.setWorkingData = setWorkingData;

顺便说一句，{{ / }}中的参数不需要ng-change ng-click：

ng-change="setWorkingData(filterSport, filterYear)"

ng-change不会触发功能

1 个答案: