javascript - AngularJs 为什么在 ng-disabled 函数上 undefined object ？

Question

查看:

我有一行重复，每行都有一个保存按钮来单独保存每个对象。如果没有进行任何更改，我希望禁用此按钮。

<tr ng-repeat="option in options | filter:search">
    <a ng-click="save(option)" ng-disabled="isUnchanged(option)">Save</a>
</tr>

Controller :

所以我将选项对象传递给函数，我得到了它在数组中的索引位置。然后将此“选项”对象与其作为服务注入(inject)的 apiKeyOptions[index] 中的原始自身进行比较。

angular.module('PartOfApp')
.controller('PartOfAppCtrl', function( $scope, ... apiKeyOptions) {

 $scope.options = apiKeyOptions;

 $scope.isUnchanged = function(option) {
       var index = $scope.options.indexOf(option);
       //compare object to the original 
       if(option.value == apiKeyOptions[index].value && apiKeyOptions[index].setting == option.setting){
            //then no changes have been made to this 
            return true;
       }else{
            return false;
       }

出于某种原因，当任何数据发生更改时，我都会收到一个包含 100 个错误的控制台，提示 apiKeyOptions[index].value 和 apiKeyOptions[index].setting 未定义。

该应用程序运行完美，因为如果它们相同但仍然抛出

，它应该返回 true

 TypeError: Cannot read property 'value' of undefined

关于 apiKeyOptions[索引]

如果我 console.log(apiKeyOptions[index].value) 我没有得到未定义的值并且所有日志都正确。

我猜我违反了一些 Angular 规则，如果有人能提供帮助那就太好了。

apiKeyOptions 概述:

apiKeyOptions 是最多包含 50 个对象的数组

每个对象的形式为

{
defaultValue: boolean,
description: null,
name: String,
setting: "Default" or Boolean,
value: Boolean
}

在下面的评论后添加:如果我添加 -

console.log(index);
console.log(apiKeyOptions[index]);

对于函数$scope.isUnchanged，我得到了预期的结果示例:

 13
 Object {name: "LOREM IPSUM", description: null, defaultValue: false, setting: "default", value: false…}

所以索引并不总是-1。我将对象传递给函数而不是 $index 的原因是因为过滤器 |搜索，因此索引将根据搜索而变化。

已修复

如下面的答案所示。我收到一个 index = -1 错误，但它被隐藏在 100 个正确的日志输出中。

奇怪的是，这并没有阻止应用程序工作，我需要更深入地研究 ng-disabled 是如何绑定(bind)到一个值的。为了解决这个问题，我简单地将indexOf替换为

for (var i = 0; i< $scope.options.length; i++ ){
            if($scope.options[i].name == option.name){
                var index = i;
            }
       }

Answer 1

问题似乎出在传递给 $scope.isUnchanged = function(option) { 的参数上由于 ng-repeat 为每个循环创建一个新范围，我怀疑每个循环可用的“选项”将是一个新对象，并且不会引用“选项”数组。

<tr ng-repeat="option in options | filter:search">

因此，您的 isUn​​changed 函数将接收参数作为新对象，因此下面的代码始终返回 -1。因为 indexOf 匹配数组中给定的参数，并且由于参数“option”是一个对象并且不引用(引用比较)数组的相同元素，因此不会找到匹配项。即 var a = {id:1};var b = [a]; b.indexOf({id:1}) === -1; b.indexOf(a) === 0;

var index = $scope.options.indexOf(option);//always be -1 in your case
// therefore apiKeyOptions[index] will always be undefined

作为解决方法，您应该将 $index 从 View 传递给 isUn​​changed。