通过ng-click事件的标记找到第一个父项

时间:2015-05-07 20:04:16

标签: javascript angularjs dom

如何仅使用jqLit​​e使用$ event查找父tr元素?

这是click事件处理程序/问题的一个示例:

<td ng-click="showDataClick($event)"><i></i></td>

这是我的模板:

<tbody>
    <tr ng-repeat="record in filteredData = (state.filteredRecords | orderBy : state.sort.column : state.sort.descending | pagination : state.settings.currentPage : state.settings.recordsPerPage)" class="table-row" audit-row record="record">
    </tr>
    <tr ng-if="filteredData.length === 0" class="table-row">
        <td colspan="5" class="text-center">No records found</td>
    </tr>
</tbody>

1 个答案:

答案 0 :(得分:0)

在阅读完整个问题之后,这是一个在点击的行jsfiddle之后插入一行的工作演示

html

 <div ng-controller="MyCtrl">
  <table>
    <tr>
        <td ng-click="showDataClick($event)"><i>Nested Element</i> no nesting element       </td>
         <td ng-click="showDataClick($event)">
           Multiple td's
         </td>
         <td ng-click="showDataClick($event)">
             <div>
                 <div>
                     nested in multiple elements
                 </div>
             </div>
         </td>            
    </tr>
    <tr>
        <td ng-click="showDataClick($event)"><i>row 1</i>
        </td>
    </tr>
    <tr>
        <td ng-click="showDataClick($event)"><i>row 2</i>
        </td>
    </tr>
</table>
</div>

JS

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.showDataClick = function (e) {
        var newRow = document.createElement('tr');
        newRow.innerHTML = '<td>Hey There I am new</td>';
        var sibling = e.currentTarget.parentNode;
        var next = sibling.nextSibling;
        var parent = sibling.parentElement;
        parent.insertBefore(newRow, next);
    }
}