上下文如何保持在角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>