无法解析父节点自定义属性

Parent node custom attribute could not be parsed

本文关键字:父节点 自定义属性      更新时间:2023-09-26

我有一个容器div,其中有一个自定义数据属性data-gid。当单击该div中的元素时,我需要获得父div的自定义属性。

Html

     <div ng-repeat="(key, qn) in list >
     <div data-gid="{{ qn.id }}" >
        <div id="child1">
           <button ng-click="getParents($event);">Click</button>
         </div>
     <div>
    </div>

Js

$scope.getParents = function(evt){
  var elem = evt.target.parentNode.getAttribute('data-gid');
  console.log(elem); 
}

问题是我总是得到data-gid作为null。当我选中

console.log(evt.target.parentNode)

我得到的是

<div data-gid="" >

这里有什么问题呢?

将gid参数传递给函数

<div ng-repeat="(key, qn) in list >
 <div data-gid="{{ qn.id }}" >
    <div id="child1">
       <button ng-click="getParents(qn.id);">Click</button>
     </div>
 <div>
</div>


 $scope.getParents = function(gid){      
  console.log(gid); 
}

由于evt.target.parentNode将指向div#child1,您需要找到它的父节点,因此您需要使用

evt.target.parentNode.parentNode.getAttribute('data-gid')

OR 我推荐您可以将qn.id直接传递给函数

<button ng-click="getParents(qn.id);">Click</button>