如何调用附加在 div 中的 angularjs 函数

Question

$scope.showtbleoption =  function(id)
{
    console.log(id);
    $("#showoption").empty();
    $("#showoption").append('<button class="btn btn-info" ng-click="editrc(id)">');
};

如何在 angularjs 控制器中调用 editrc() 函数？

Answer 1

将 DOM 附加到 jQuery 会使 angular 指令编译。您必须使用 $compile 服务，通过该服务您将首先 $compile 那个 DOM 然后将那个 DOM 注入 DOM 树。 $compile 是 API 函数（returns 函数），它要求 DOM，然后您可以通过传递 $scope 再次调用该函数以针对特定的 [=15 进行评估=]. $compile API 方法将负责编译 DOM 上的所有指令并更新 bindings.

在下面的情况下，id 值不会直接在 $scope 中可用，您可以将它存储在范围变量中或通过字符串连接传递它。

var compiledDom=$compile('<button class="btn btn-info" ng-click="editrc('+id+')">')($scope);
$("#showoption").append(compiledDom);

Answer 2

不使用 jQuery 进行附加，而是使用 $compile 服务将其绑定到 dom。像这样：

$scope.domEle = $compile('<button class="btn btn-info" ng-click="editrc(id)">')

并在 HTML 中这样调用：

{{ domeEle }}

然后在控制器中像这样定义 editrc 函数：

$scope.editrc = function(val){

}

Answer 3

您可以使用 ng-bind-html 指令将 html 动态绑定到模板。但是，您必须通过执行 $compile(<html>) 使用 $compile 编译 html 。已编译的 html 中提到的任何表达式都可以调用您在控制器中提供的定义。

如何调用附加在 div 中的 angularjs 函数

how to call angularjs function which is appended in div

javascript

codeigniter

angularjs

angularjs-controller

angularjs-compile