没有调用ng-change函数而且没有错误?

时间:2016-05-17 14:39:50

标签: javascript angularjs

我正在使用角度的选择框,看起来好像永远不会调用ng-change函数。这是select的代码:

<select
    data-ng-options="choice.id as choice.singular for choice in model.doseUnitChoices"
    data-ng-model="ucumId"
    data-ng-change="updateForm()"
    class="form-control input-sm">
    <option value=""></option>
</select>

我已经简化了控制器函数中的代码来完成所需的最小代码:

  updateForm: function(){
    console.log('test');
  },

到目前为止一切正常,下拉列表显示所有可用选项,但是当我在下拉列表中选择任何选项时,它会立即更改回最后一个选项,这可能意味着什么,并且永远不会调用更改函数控制台中没有出现错误?关于如何调试此问题并找出错误的任何想法?

更新:有趣的是,我在检查页面上的元素时发现,实际上所有选择元素都被列为选中,可能是数据被用作模型的问题?调查它

2 个答案:

答案 0 :(得分:3)

我发现这个问题是由问题范围之外的两个问题引起的:

    调用此选择时,
  1. ucumId不存在,我猜这会导致所有选择选项都以某种方式设置为选中状态?
  2. 因为上述错误导致所有选项都被选中,无论我在选择中做了什么,它都没有更新数值,所以没有发生任何变化?
  3. 无论如何确保&#39; ucumId&#39;存在修复了我遇到的问题,

答案 1 :(得分:2)

我只是尝试复制它并使用最少量的代码,它工作正常。

<html>
<body ng-app="app" ng-controller="myController">
    <select 
        data-ng-options="choice as choice.label for choice in model.doseUnitChoices" 
        data-ng-model="ucumId" 
        data-ng-change="updateForm()"
        class="form-control input-sm">

        <option value=""></option>
    </select>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js "></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js "></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js "></script>
    <script>
        angular.module("app",[]).controller("myController", myController)

        function myController($scope) {
            $scope.ucumId = "";

            $scope.updateForm = function(){
            console.log('test');
            };

            $scope.model = {}

            $scope.model.doseUnitChoices = [
                {id: 1, label: "one" },
                {id:2, label: "two" }
            ]

        }
    </script>
</body>
</html>

我怀疑在某个地方有一个小错字,updateForm在某处被重新定义,或者你的控制器在某个地方被重新定义。我建议将实际代码配对并逐个删除,直到你达到工作或类似的程度。