jQuery

Question

我正在尝试多次选择行并拖动到另一个容器中。 我可以在不使用ng-repeat值的情况下进行多次拖放。如果我使用ng-repeat $（“。draggable_tr”）。单击（不调用function（）函数。我不知道为什么不支持ng-repeat值。我使用以下链接作为参考http://jsfiddle.net/83k9k/5/。

Html代码：

<div class="new-drag">                    
  <div class="myHeight" style="width: auto;" ng-scrollbars>
    <div id="table1" class="bitacoratable">
      <table id="table1" class="table table-hover table-striped childgrid border-zero">
          <tr class="draggable_tr " ng-repeat="t in tabledata">
              <td width="30" class="table-hover-dots">
                  <i class="table-dots dots"></i>
                  <div class="w-15 custom-inputs checkbox">
                      <input type="checkbox" name="check" id="check-1">
                      <label for="check-1"></label>
                  </div>
              </td>
              <td width="60" >{{t.id}}</td> 
              <td width="200">

              {{t.name}}
                  </a>
              </td>
              <td width="60">{{t.dep_no}}</td>
              <td width="80">{{t.status}}</td>
              <td width="80">{{t.city}}</td>                                       
          </tr>     
          </table>
      </div>
   </div>
</div>

JS代码：

*$("#table1 .childgrid tr, #table2 .childgrid tr").draggable({
helper: function(){
    var selected = $('.childgrid tr.selectedRow');
        if (selected.length === 0) {
            selected = $(this).addClass('selectedRow');
}
    var container = $('<div/>').attr('id', 'draggingContainer');            
    container.append(selected.clone().removeClass("selectedRow"));
    return container;
}
});

$("#table2 .childgrid").droppable({
drop: function (event, ui) {
console.log(angular.toJson(event));
$(this).append(ui.helper.children());
//$('.selectedRow').remove();
}
});
$scope.tabledata=[{"name":"domas","id":2,"dep_no":"de_09","status":"Active","city":"Newyork"},{"name":"domas","id":2,"dep_no":"de_09","status":"Active","city":"Newyork"},{"name":"domas","id":2,"dep_no":"de_09","status":"Active","city":"Newyork"},{"name":"domas","id":2,"dep_no":"de_09","status":"Active","city":"Newyork"},{"name":"domas","id":2,"dep_no":"de_09","status":"Active","city":"Newyork"}]

$(".draggable_tr").click(function(){                    
$(this).toggleClass("selectedRow");
});

Answer 1

你需要directive。

HTML

<table>
  <tr class="draggable_tr" my-tr-directive>
</table>

JS

.directive("my-tr-directive", function() {
    return {
        link: function(scope, elem, attrs) {
            $(elem).click(function() {
                console.log('Here I am!');
            });
        }
    }
});

有关详细信息，请查看here