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

【问题标题】：how to call angularjs function which is appended in div如何调用附加在div中的angularjs函数
【发布时间】：2017-08-27 21:06:35
【问题描述】：

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

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

【问题讨论】：

使用控制器内的范围变量创建函数。 $scope.editrc = function(id){};

标签： javascript angularjs codeigniter angularjs-controller angularjs-compile

【解决方案1】：

使用 jQuery 附加原始 DOM 将使 angular 指令编译。您必须使用$compile 服务，通过它您将首先成为$compile 该DOM，然后将该DOM 注入到DOM 树中。 $compile 是请求 DOM 的 API 函数（返回函数），然后您可以通过传递 $scope 再次调用该函数以针对特定的 context 进行评估。 $compile API 方法将负责编译 DOM 上的所有指令并更新 bindings。

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

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

【讨论】：

@Anil，您可以接受并支持答案，谢谢 :)

【解决方案2】：

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

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

在 HTML 调用中是这样的：

{{ domeEle }}

并且在控制器中定义如下editrc函数：

$scope.editrc = function(val){

}

【讨论】：

【解决方案3】：

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

【讨论】：