Question

我一直试图在数据表行中调用editFleet（id），但遗憾的是它无效。代码如下：

angular.module("app").controller('FleetsCtrl', function($scope, $http, $rootScope, $cookies) {
$http({
    method: 'GET',
    url: 'someURL' + $cookies.get("account_id"),
    headers: {
        "x-access-token": $cookies.get("token"),
        "content-type": "application/json",
        "cache-control": "no-cache"
    },
    async: true,
    crossDomain: true
}).success(function(data) {
    $("#loading").css('display', 'none');
    $html = "<tr><th width='25%'>Fleet Name</th><th>Assets</th><th>Description</th><th class='no-sort' width='219px'></th></tr>";
    $('#datatables thead').append($html);
    for (var i = 0; i < data.response.length; i++) {
        var fname = data.response[i].name;
        var fdesc = data.response[i].desc;
        var id = data.response[i].fleet_id;
        var asset_count = data.response[i].asset_count;
        $html = "<tr> <td>" + fname + "</td><td width='25%'>" + asset_count + "</td> <td width='25%;'>" + fdesc + "</td> <td style='text-align:right;'> <button title='Edit' data-ng-click='editFleet(" + id + ")' type='button' class='btn btn-success glyphicon glyphicon-cog'></button> <button type='button' onclick='deleteFleet(" + id + ")' class='btn btn-success glyphicon glyphicon-remove' title='Delete'></button> </td>";
        $('#datatables tbody').append($html);
    }
}).error(function(error) {
    alert("Error");
});

$scope.editFleet = function(id){
    console.log("check");
}

}）;

我不想像在原始js中那样从onclick事件调用该函数。有没有办法打电话给ng-click？提前致谢

Answer 1

它无法正常工作，因为您无法将角度函数绑定到通过jQuery创建的DOM。这不是正确的方法。你需要使用angular指令。

Answer 2

我碰巧解决了这个问题，但不知道这是否是正确的做法，但它对我有用。

我在追加之前使用了$compile。这是保持连续性的完整代码：

angular.module("app").controller('FleetsCtrl', function($scope, $http, $rootScope, $cookies, $compile) {
$http({
    method: 'GET',
    url: 'someURL' + $cookies.get("account_id"),
    headers: {
        "x-access-token": $cookies.get("token"),
        "content-type": "application/json",
        "cache-control": "no-cache"
    },
    async: true,
    crossDomain: true
}).success(function(data) {
    $("#loading").css('display', 'none');
    $html = "<tr><th width='25%'>Fleet Name</th><th>Assets</th><th>Description</th><th class='no-sort' width='219px'></th></tr>";
    $('#datatables thead').append($html);
    for (var i = 0; i < data.response.length; i++) {
        var fname = data.response[i].name;
        var fdesc = data.response[i].desc;
        var id = data.response[i].fleet_id;
        var asset_count = data.response[i].asset_count;
        $html = $compile("<tr> <td>" + fname + "</td><td width='25%'>" + asset_count + "</td> <td width='25%;'>" + fdesc + "</td> <td style='text-align:right;'> <button title='Edit' data-ng-click='editFleet(" + id + ")' type='button' class='btn btn-success glyphicon glyphicon-cog'></button> <button type='button' onclick='deleteFleet(" + id + ")' class='btn btn-success glyphicon glyphicon-remove' title='Delete'></button> </td>")($scope);
        $('#datatables tbody').append($html);
    }
}).error(function(error) {
    alert("Error");
});

$scope.editFleet = function(id){
    console.log("Success");
}

}）;

这很好用，服务于我的目的。

P.S。如果这不是正确的方法，请发布您的建议和解决方案。

ng-click在数据表中不起作用

2 个答案: