2017-02-10 106 views
0

我有幾篇關於這方面的文章,但沒有得到適合我的問題的解決方案。我採用了棱角分明的js 1.5和Bootstrap 3如何通過Angular js獲取元素的ID

我的代碼是什麼樣子,

<a href="" class="noUnderline" data-trigger="focus" data-toggle="popover" data-placement="bottom" data-content = "{{helpSrv.helpMessage}}" > 
<i class="fa fa-info-circle infoCirc" ng-click="helpSrv.showPopOverInfo($event)" id="forecastAttainmentId"> </i> 
</a> 

我想說明的酥料餅時,將點擊i圖標。現在,helpSrv是用Angular JS編寫的一項服務。 helpMessage由元素的id選擇。 helpSrv是包含像兩件事服務,

var s = this 
s.helpInfo = { 
"forecastAttainmentId": "Some text" 
} 
s.showPopOverInfo = function (event) {  
     var helpSelect = event.target.id 
     s.helpMessage = s.helpInfo[helpSelect] 
     console.log(s.helpMessage) 
} 

現在,當我點擊了第一次i圖標它顯示在酥料餅{{helpSrv.helpMessage}}。下次顯示實際信息,即Some text。我認爲延遲是由於函數調用造成的。如何解決?或者有什麼辦法可以使用angular(不帶任何插件)自動獲取元素的id,這樣我就可以使用data-content="{{helpSrv.helpInfo['id of the element']}}"來獲取Popover的消息。

+0

它真的是'ng-lick'嗎?你拼錯了,它應該是'ng-click' – pryxen

回答

0

您可以使用jQuery通過使用$("#forecastAttainmentId").click(function(){...}來訪問i標記。您還需要初始化helpSrv.helpMessage,以便在第一次加載彈出窗口時能夠看到數據。

0

這是關於AngularJs digest cycle。嘗試使用$超時:

s.showPopOverInfo = function (event) {  
    $timeout(function(){ 
     var helpSelect = event.target.id; // Always end lines with a semicolon 
     s.helpMessage = s.helpInfo[helpSelect]; 
     console.log(s.helpMessage); 
    }, 0); 
}; 
+0

我已經使用了$超時。但仍然沒有幫助 – Anijit

+0

請在jsfiddle或jsbin等上創建一個例子 –