AngularJS1.x对象数组函数参数未定义：填空题调用$parent报错

嘿，你在AngularJS 1.x项目上的改造思路挺清晰的啊——从选择题转成拉取JSON数据的填空题，还搞定了核心的答案匹配验证，这步已经做得很棒了！针对你提到的调用$parent.in...（应该是$parent.incorrect这类属性吧？）时代码失效的问题，我帮你梳理几个常见的原因和解决方案：

1. 原型继承的“遮蔽”坑：基本类型属性的问题 #

AngularJS的子作用域（比如ng-repeat、ng-if创建的作用域）是基于原型继承父作用域的，但如果父作用域的属性是基本类型（数字、布尔、字符串），子作用域里直接赋值会创建一个属于自己的同名属性，而不是修改父作用域的那个值。这时候你用$parent.xxx看起来是在操作父属性，但其实可能因为作用域上下文的变化，没找到正确的父作用域。

解决办法：把需要跨作用域修改的属性包装成一个对象（引用类型），比如：

// 父控制器里不要直接定义基本类型
// $scope.incorrect = 0;
// 改成对象包装
$scope.quizStats = { incorrect: 0 };

然后在子作用域里调用时，用$parent.quizStats.incorrect++，这样操作的是对象的属性，不会触发遮蔽问题。

2. 避免直接依赖$parent：用控制器方法更可靠 #

直接使用$parent是不太推荐的实践，因为一旦你的DOM结构或者作用域层级变化（比如加了个ng-if嵌套），$parent指向的作用域就可能变了。更好的方式是在父控制器里定义修改状态的方法，然后在子作用域里直接调用：

// 父控制器
app.controller('QuizController', function($scope) {
  $scope.quizStats = { incorrect: 0 };

  // 定义修改错误次数的方法
  $scope.recordIncorrectAnswer = function() {
    $scope.quizStats.incorrect++;
  };
});

在模板里直接调用这个方法就行，不用管作用域层级：

<input type="text" ng-model="userAnswer" />
<button ng-click="checkAnswer()">提交答案</button>

<!-- 在验证不通过时调用方法 -->
<div ng-if="!isAnswerCorrect()">
  <span>答案错误！</span>
  <button ng-click="recordIncorrectAnswer()">标记错误</button>
</div>

3. 检查是否存在隔离作用域 #

如果你是用自定义指令来实现填空组件，并且指令设置了scope: {}（隔离作用域），那$parent指向的是指令所在的父作用域，但隔离作用域默认不会继承父作用域的属性。这时候你需要通过双向绑定把父作用域的属性传递进来：

app.directive('fillInBlank', function() {
  return {
    scope: {
      // 双向绑定父作用域的quizStats对象
      quizStats: '='
    },
    templateUrl: 'fill-in-blank.html',
    link: function(scope) {
      scope.checkAnswer = function() {
        if (scope.userAnswer !== scope.correctAnswer) {
          scope.quizStats.incorrect++;
        }
      };
    }
  };
});

然后在使用指令时传递属性：

<fill-in-blank quiz-stats="quizStats" correct-answer="question.correctAnswer"></fill-in-blank>

4. 排查拼写和上下文错误 #

最后再确认下你调用的$parent.in...是不是拼写错误（比如应该是$parent.incorrect却少打了字符），以及这段代码所在的DOM元素是不是在某个创建了子作用域的指令（比如ng-repeat、ng-switch）里面，确保$parent确实指向了包含目标属性的那个父作用域。

如果还是有问题，你可以把涉及$parent调用的代码片段贴出来，这样能更精准地定位问题~

内容的提问来源于stack exchange，提问作者user5854648