javascript - AngularJS:为什么(显然)不需要为 ng-model 声明变量？

Question

其他人可能对这种现象感到困惑，所以我在这里发布这个问题。

HTML

<select 
    ng-model="cont.selectedItem" 
    ng-options="item.name for item in cont.lists.items" >
</select>

//"cont" indicates the controller. $scope is not used here

<span ng-click="addNewItem()">add</span>

JS

var instance = this;
instance.list = { ...item instances... };
instance.selectedItem;//Is it really necessary?

instance.addNewItem = function() {
  var  item = instance.selectedItem;
  ...
}

我曾经认为ng-model中使用的selectedItem必须在JS中声明为instance.selectedItem ，这样我就可以看到在 ng-options 中选择了哪个 item。

但是，我注意到 addNewItem 函数中的 var item 获取所选项目，即使 instance.selectedItem 为注释掉。

我查阅了 Angular 的文档，但找不到原因。

如有任何建议，我们将不胜感激。

Answer 1

在您的情况下，您在 Controller 的 this 上下文中定义一个基本类型变量，默认情况下 selectedItem 的值未定义为 this 已经被定义了:)。在此，当 Angular $parser 设置一个值时。该操作非常简单。在幕后 $parse 为您做这件事。

让我向您展示另一个示例，您可以在其中看到 $parse API 的实际魔力。假设您想为尚未定义 model 对象的 model.something 设置值。让我们将该值传递给 $parse API 并为其分配一些值(请参阅下面的代码将帮助您理解)。当您将 model.something 值分配给 ng-model 指令时，也会发生同样的事情。每当您更改 ng-model 值时，它就会为其上下文的基础变量分配一个值。

下面的示例说明了 $parse 的工作原理。

mainMod.controller('MainCtrl', ['$parse','$interpolate','$compile',
    function ($parse,$interpolate,$compile) {
         var vm = this; 

         //$parse
         vm.parse = $parse('model.something');
         //assigning value to `model.something` from `vm`
         //so the value is going to put inside `vm`
         //while assigning a value it check that value exists or not
         //if it isn't exist then it creates an value inside mentioned context
         //here context is `vm`(this)
         vm.parse.assign(vm, 'Pankaj'); 
         console.log(vm.model); //vm.model will have { something: 'Prakash' }
    }
]);