我有一个指令来扩展和折叠html表的行,正如你在第一列的图像中看到的那样 我有一个“+”符号,所以当我点击它时,我调用一个函数,它调用一个与该记录相关的数据的WS。 (那部分工作正常)
这是我的指示:
angular.module('headline.Drilldown',[])
.directive('drillDown',drillDown);
function drillDown() {
var directive = {
restrict: 'A',
link: link
};
return directive;
function link(scope,element) {
var table = $('.categories-table');
table.each(function() {
var $table = $(this);
$table.find('.parent').each(function(){
if($(this).nextUntil('.parent', ".child").length >= 0){
$(this).children('td:first').html('+');
}
});
$table.find('.child').each(function(){
if($(this).nextUntil('.child', ".grandson").length >= 0){
// $(this).children('td:first').html('+');
}
});
var $childRows = $table.find('tbody tr').not('.parent').hide();
$table.find('button.hide').dblclick(function() {
$childRows.hide();
});
});
element.on('dblclick',function(){
if($(this).parent().hasClass('parent') === true)
{
console.log("----Parent");
if ($(this).text() === "+")
$(this).text("-")
else
$(this).text("+");
$(this).parent().nextUntil('.parent', ".child").fadeToggle("fast", "linear");
$(this).parent().nextUntil('.parent', ".grandson").hide("fast");
$(this).parent().nextUntil('.parent', ".child").each(function(){
if($(this).children('td:first').text() === '-')
$(this).children('td:first').text('+');
});
}
else if($(this).parent().hasClass('child') === true)
{
console.log("----Child");
if ($(this).text() === "+")
$(this).text("-")
else
$(this).text("+");
$(this).parent().nextUntil('.child', ".grandson").fadeToggle("fast", "linear");
}
});
}
这就是我在控制器中使用我的功能的方法:
$scope.drillDown = function () {
//Call to WS
}
这是我在视图中调用我的函数的方式:
<tr class="parent">
<td ng-click="drillDown()" ng-class="expand" drill-down></td>
</tr>
<tr class="child">
<td d in data ng-class="expand" drill-down></td>
<td>d.description</td>
<td>d.lastName</td>
</tr>
我的问题是,如果我点击它崩溃一旦它扩展它再次调用该函数,我只是想调用函数扩展一行不要崩溃因为它调用相同的数据两次,我不知道如何实现这根本不知道,我真的需要帮助。