Boostrap 3：點擊按鈕不起作用

Question

我正在使用AngularJS和Twitter Bootstrap的Web應用程序。我的應用程序在Firefox中運行良好，但在Chrome或Chromium（我的操作系統是Ubuntu）上單擊按鈕時，該點擊未正確檢測到。點擊被檢測到但對象事件爲空或未被檢測到。如您所見，它只寫入evento:而不寫入id。在Firefox中，它正確地寫入evento:和id。

HTML：

<button id = "removeLeftTables" ng-click = "hmCtrl.changeView($event)"> 
    <span class="glyphicon glyphicon-remove " aria-hidden="true" style = "vertical-align: middle; font-size: 25px"></span> 
</button> 

JS：

self.changeView = function(event){ 
    console.log("evento: " + event.target.id); 
    if (event.target.id == "removeLeftTables"){ 
     self.show_left_tables = false; 
     self.style_left_content = ""; 
     self.style_right_content = ""; 
     self.style_tables_content = "";  
     self.cleanTabStyles(); 
    } 

    if (event.target.id == "removeRightTables"){ 
     self.show_right_tables = false; 
     self.style_right_content = ""; 
     self.style_left_content = ""; 
     self.style_tables_content = ""; 
     self.cleanTabStyles(); 
    } 
} 

我一直在使用相同的代碼來檢查錯誤使這個plunker和它的作品：https://plnkr.co/edit/vbBhVCrkpLyRl63Lwlur

我什麼都不懂。爲什麼它不能在我的web應用程序中工作，而在蹲點工作正常？發生了什麼？

編輯1： 我的目標是獲得對象的id我已經做了一個clic。使用Firefox，Chrome和Chromium。現在，來自事件的ID僅由Firefox檢索。使用Chrome和Chromium時，事件被解僱，我無法從對象事件中檢索ID。

編輯2： 我已經添加了一個跟蹤到我的代碼，知道是事件變量是否爲空，當我在Chrome中點擊o鉻事件變量不爲空，但ID未檢測到！

$scope.changeView = function(event){ 
    if (event == null) 
     console.log("event is NULL"); 
    else 
     console.log("event IS NOT NULL"); 
    console.log("evento: " + event.target.id); 
    if (event.target.id == "removeLeftTables"){ 
     self.show_left_tables = false; 
     self.style_left_content = ""; 
     self.style_right_content = ""; 
     self.style_tables_content = "";  
     self.cleanTabStyles(); 
    } 

    if (event.target.id == "removeRightTables"){ 
     self.show_right_tables = false; 
     self.style_right_content = ""; 
     self.style_left_content = ""; 
     self.style_tables_content = ""; 
     self.cleanTabStyles(); 
    } 
} 

Answer 1

您可以通過currentTarget而不是嘗試target。由於currentTarget獲取其事件監聽器觸發特定事件

self.changeView = function(event) { 
    console.log("evento: " + event.currentTarget.id); 
}; 

它可以幫助你的元素

Answer 2

看一看固定小提琴： https://plnkr.co/edit/QftJvAhSYmfq57zknWq8?p=preview

在通常情況下，你應該在控制器，而不是this.checkClick()使用$scope.checkClick()：

$scope.checkClic = function(obj) { 
    console.log("obj: " + obj); 
}; 

，沒有點在HTML中調用方法，如ctrl.methodName()。

你可以這樣做：

<button ng-click = "checkClick('Button Clicked!!!')"> 

使用這個只允許在services。 即使在factories你不應該使用this（使用return {a:..., b: function(){...}}語法。

在控制器或指令你應該使用$scope（或scope的指令）提供您的方法爲html