上下文如何保持在角DOM

Question

考虑下面DOM

<div ng-controller="A"> 
    <button ng-click="sayHello()">SayHello</button> 
</div> 
<div ng-controller="B"> 
    <button ng-click="sayHello()">SayHello</button> 
</div> 


A(){ 
    var sayHello() = function(){ 
    console.log("Hello") 
    } 
} 
B(){ 
    var sayHello() = function(){ 
    console.log("Hello") 
    } 
} 

假设我们有2控制器A和B他们每个人都有sayHello()方法。

• 函数的上下文是如何维护的？
• 角怎么知道要调用哪个函数？
• 如何用原生JavaScript实现相同？

编辑1 - 如何上下文DOM关联

<script> 
    var module = { 
    namspace: {} 
    } 
    var module.namspace.object1 = {} 
    var module.namspace.object1.someFunction = function(){} 
    var module.namspace.object2 = {} 
    var module.namspace.object2.someFunction = function(){} 
</script> 
<div context="module.namspace"> 
    <div context="object1"> 
     <button id="button1" onClick="someFunction()">Click Me</button> 
    </div> 
    <div context="object2"> 
     <button id="button2" onClick="someFunction()">Click Me</button> 
    </div> 
</div> 

所以，预期的行为是：

1. 当我点击#button1module.namspace.object1.someFunction需要得到所谓
2. 时我点击#button2module.namspace.object2.someFunction需要拨打

Answer 1

它的作用和角度的特殊性，controller定义特定scope，并且只使用这个scope申报代码。

与命名空间相同的东西。如果方法存在，他只执行A.sayHello()，否则执行其他错误。他没有区分他们。

您无法使用JavaScript在HTML中定义特定范围，但可以使用名称空间并创建相同的名称。

var A = {}; // namespace A 
 
A.sayHello= function(){ 
 
    alert("A hello"); 
 
}; 
 

 

 
var B = {}; // namespace B 
 
B.sayHello= function(){ 
 
    alert("B hello"); 
 
};

<div onclick="A.sayHello()"> 
 
    A 
 
</div> 
 
<div onclick="B.sayHello()"> 
 
    B 
 
</div>