在angularjs中獲取ng-click函數中元素的屬性

我有一個像下面這樣的span標籤，它在單擊時調用控制器中的函數。在angularjs中獲取ng-click函數中元素的屬性

HTML

<div class="row" ng-repeat="event in events"> 
    <div class="col-lg-1 text-center"> 
     <span class="glyphicon glyphicon-trash" data={{event.id}} ng-click="deleteEvent()"> 
     </span> 
    </div> 
</div>

控制器

$scope.deleteEvent=function(){ 
    console.log(this); 
}

我需要在控制器功能的數據屬性的值。我嘗試使用這個關鍵字和$事件;沒有人工作。

請幫忙。

來源

2013-08-03 Saravanan

嘗試直接傳遞到NG-點擊功能：

<div class="col-lg-1 text-center"> 
    <span class="glyphicon glyphicon-trash" data="{{event.id}}" 
      ng-click="deleteEvent(event.id)"></span> 
</div>

那麼就應該在你的處理器是可用：

$scope.deleteEvent=function(idPassedFromNgClick){ 
    console.log(idPassedFromNgClick); 
}

這裏的an example

來源

2013-08-03 04:35:29 jandersen

其實這整個div進來ng重複。所以我不能在ng-click中使用event.id。我認爲。 – Saravanan

查看jsFiddle鏈接，我剛添加到我的答案中，在'ngRepeat'中使用'ngClick'參數的示例 – jandersen

非常感謝。我昨天嘗試了這個，花了3個多小時。它力求工作。我可能犯了一些錯誤。反正現在它的工作，並感謝小提琴。它有幫助。 – Saravanan

更簡單，通過$event對象到ng-click來訪問事件屬性。舉個例子：

<a ng-click="clickEvent($event)" class="exampleClass" id="exampleID" data="exampleData" href="">Click Me</a>

在您clickEvent() = function(obj) {}功能，你可以這樣訪問data值：

var dataValue = obj.target.attributes.data.value;

這將返回exampleData。

這裏是full jsFiddle。

來源

2013-08-03 07:23:20

你的jsFiddle在Chrome中可以正常工作，但不能在FireFox中使用？ – Michiel

感謝您的支持。我用'obj.target'更好地解決了jsFiddle問題。 –

我發現你可以做'obj.target.getAttribute（「data」）'看起來更具可讀性IMO，js在這裏提琴：http://jsfiddle.net/zpApT/ –

加成佈雷特代物的答案：（現在更新）在IE

var dataValue = obj.srcElement.attributes.data.nodeValue;

工作正常（9+）和Chrome，但Firefox不知道srcElement屬性。我發現：

var dataValue = obj.currentTarget.attributes.data.nodeValue;

在IE，Chrome和FF，我沒有測試Safari瀏覽器。

來源

2014-02-26 14:27:19 Michiel

謝謝Michiel。我更新了jsFiddle來解決這個問題。我使用更普遍的'obj。目標屬性現在獲取屬性。 –

是Brett，我同意最好使用目標，更新我的代碼，謝謝！ – Michiel

在angularjs中獲取ng-click函數中元素的屬性

回答

相關問題