Question

我试图理解指令和'$ compile'是如何工作的，所以我试图将一个html按钮和一个onclick函数绑定到一个角度变量。

更具体地说，当我点击按钮时，我只会弹出一个警告，显示一些文字。

这是我的html（尽可能简单）：

writeFeatures()

以下是我如何定义'compile'指令：

<div compile="test"></div>

这是控制器：

angular.module("myApp").directive('compile', ['$compile', function ($compile) {
return function(scope, element, attrs) {
    scope.$watch(
        function(scope) {
            return scope.$eval(attrs.compile);
        },
        function(value) {
            element.html(value);
            $compile(element.contents())(scope);
        }
    )}
}]);

上述代码不起作用，警报显示“未定义”。相反，如果我执行以下操作，则可行：

angular.module("myApp").controller('myController', ['$scope', function ($scope) {

    $scope.foo = function (input) {
        alert(input);
    };

    var str = "clicked";
    var result = "<button ng-click='foo(str)'>click me</button>";
    $scope.test = result;
}

我缺少什么想法？我该怎么做才能将参数传递给函数foo？

提前多多感谢！

Answer 1

我想在这种情况下：

Error com.orientechnologies.orient.core.command.OCommandExecutorNotFoundException - Cannot find a command executor for the command request: sql.Create

警告你“点击”，因为你像字符串参数一样传递它。

var result = "<button ng-click='foo(\"clicked\")'>click me</button>";

- 在这种情况下，str不被识别为str变量。

尝试以他的方式使用它：

 var result = "<button ng-click='foo(str)'>click me</button>";

Answer 2

将示例中的

ng-click 插入到事件循环堆栈中，等待其元素上的JS click事件。触发时， ng-click 指令下的函数使用角度范围执行，您的元素属于，并且没有分配给范围的 str 变量。当您使用var str = "clicked";时， str 是 myController 的匿名函数中的私有变量。最简单的解决方案是在范围上设置 str ：

app.controller('myController', ['$scope', function ($scope) {

  $scope.foo = function (input) {
    alert(input);
  };

  $scope.str = "clicked";
  var result = "<button ng-click='foo(str)'>click me</button>";
  $scope.test = result;
}]);

但请记住，此范围变量可能会被修改，直到执行。

plunker：http://plnkr.co/edit/HJCprBRmatl5ikRCJXWx?p=preview

无法使用Angular指令将参数传递给函数

2 个答案: