当ngOptions中使用的数组/对象设置为空/未定义/ null时,将评估ngChange表达式

时间:2016-07-28 18:15:01

标签: angularjs drop-down-menu ng-options angularjs-ng-change

我刚刚在Angular.js中发现了一个奇怪的功能/错误。

让我们假设我们有一个选择框,其中的选项由ngOptions指令填充。我们使用ngChange指令在selectbox上设置了一个更改监听器。

<select ng-model="model" ng-options="item for item in list" ng-change="foo()"></select>

我们将范围定义如下:

$scope.list = [1,2,3,4,5];
$scope.model = 3;

$scope.foo = function() {
    console.log("change");
};

然后我们在代码中的某处重置数组,如下所示:

$scope.list = [];

如果我们查看控制台,我们可以看到调用了函数foo()并记录了文本"change"。但是,用户未触摸选择框,并且未更改所选值。根据文件

  

只有在输入发生变化时才会评估ngChange表达式   value会将新值提交给模型。

     

不会被评估

     
      
  • 如果$ parsers转换管道返回的值未更改
  •   
  • 如果输入继续无效,因为模型将保持为空
  •   
  • 如果以编程方式更改模型而不是更改输入值
  •   

输入值已更改。该模型已更改。只有用于生成选项的数组(对象具有相同的行为)已经以编程方式更改。

通过检查select元素,我还发现ng-dirty类已设置为元素,即使用户从未触及选择框(仍然设置了类ng-untouched)。

为什么会这样?这是一个我无法理解的奇怪特征,或者它是一个错误?难道我做错了什么?你知道这个问题的解决方案吗?

1 个答案:

答案 0 :(得分:0)

设置列表时:

$scope.list = [];

这会触发ng-change,因为它会更改选项列表,从而更改输入值。

我看到您突出显示:如果以编程方式更改模型而不是更改输入值

在这种情况下,您不会以编程方式更改模型。