为什么我的Angular ngModel示例未引发错误？

Question

我已经阅读了几篇关于Angular $ scope的SO响应，以及它如何是一个普通的旧JavaScript对象，这意味着它将遵循JS的原型继承（ AngularJS中范围原型/原型继承的细微差别是什么？ ）

既然是这种情况，我很好奇为什么我的以下示例不会抛出错误：

<!doctype html>
<html ng-app='MyApp'>
<head>
  <meta charset='utf-8'>
  <title>Egghead</title>
  <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js'></script>
  <script>
    var app = angular.module('MyApp', []);
    app.controller('MainCtrl', ['$scope', function ($scope) {

    }])
  </script>
</head>
<body>
  <div ng-controller='MainCtrl'>
    <input type='text' ng-model='data.message'>
    <p>{{ data.message }}</p>
  </div>
</body>
</html>

基于原型继承，这是我期望发生的事情：

1. 调用MainCtrl时，它将为MainCtrl及其对应的视图创建$ scope对象。
2. 每当您在输入框中键入内容时，它将在$ scope.data.message中绑定一些字符串。
3. 但是，为此，JavaScript的第一步将是尝试解析$ scope.data。
4. 由于MainCtrl函数没有data属性，因此它将尝试在rootScope中查找data属性。
5. 由于rootScope没有数据属性，因此$ scope.data应该解析为“未定义”。
6. 最后，如果您尝试分配给undefined.message，这将引发错误。

但是，该代码可以愉快地工作并且数据已正确绑定。 有人可以帮忙解开为什么这不会给我带来错误吗？

Answer 1

发表我的原始评论是因为我不是100％，但是在检查了文档之后，是因为...

“ ngModel将尝试通过在当前作用域上评估表达式来绑定到给定的属性。如果该属性在该作用域上尚不存在，则将隐式创建该属性并将其添加到该作用域。”

因此，如果该属性不存在，它将在将其赋值时创建。

src： 这里

Answer 2

它之所以不会失败，而我的意思是ngModel ，是因为它是一种双向数据绑定指令。 您可以在另一篇文章中阅读有关此内容的更多信息：

ng-model和ng-bind有什么区别

但是，解释此行为的更简单方法是，如果在ngModel使用了变量，那么即使该变量不存在，您也将其声明为作用域的一部分。