Question

我在阅读本网站上的文章时感到困惑（陷阱＃5）：

http://thenittygritty.co/angularjs-pitfalls-using-scopes

http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html

我的问题是：

这个场景非常类似于普通js中具有相同名称的两个变量，一个在本地定义（例如在嵌套函数内）和一个全局定义（例如windows.onload），因此本地一个总是覆盖全球一个？
我有点明白$ scope.variable应该引用一个包含值的模型，但如果它们具有相同的名称，它不会真正影响结果，无论是否有点语法。我不明白是否放了“。” dot会导致上面的OUTPUT VALUE产生差异。例如，将其替换为{{user.name}}。这种最佳实践如何运作？

如果第二个{{username}}发生变化，该网站的以下代码会尝试说明，第一个{{username}}不会更改。

HTML：

<span>Outside Controller: Your name is: {{username}}</span>
<div ng-controller="SignupController">
    <span>Inside Controller: Your name is: {{username}}</span>
    <fieldset legend="User details">
    <input ng-model="username" />
    </fieldset>
</div>

JS：

var app = angular.module('app', []);
app.controller('SignupController', function($scope){});

Answer 1

它就像JavaScript中的原型继承一样。

function Jedi(){}
Jedi.prototype.name = 'Luke';

现在，如果你这样做：

var obiwan = new Jedi();
console.log(obiwan.name); //Luke

但是，如果我这样做：

var obiwan = new Jedi();
obiwan.name = 'Obi-wan';
console.log(obiwan.name); //Obi-wan

var luke= new Jedi();
console.log(luke.name); //Luke

这是JavaScript解析属性的方式。在读取属性时，它首先在对象中查找它，如果没有找到它，它会在原型中查找它，如果没有找到它在原型的原型中查找它等等，直到它到达原型链的顶部（如果没有找到）。

但是，在编写属性时，如果对象尚未具有给定字段，则会创建该对象，并且从该时刻开始，根据上面解释的搜索条件，您在读取时获得的值是直接在对象，而不是原型。

angular中建议的解决方案是将模型数据不直接存储在作用域中的字段中，而是作为对象存储，以避免此行为。例如：

function Jedi()
Jedi.protype.data = {name: 'Luke'};

var obiwan = new Jedi();
obiwan.data.name = 'Obi-wan';

var luke= new Jedi();
console.log(luke.data.name); //Obi-wan

这次原型继承下的字段是data，因此所有对象都共享它。

无法理解AngularJs中的嵌套作用域

1 个答案: