Question

在将已编译的html设置为dynamic-html div之前，我的dynamicHtml正常运行。如您所见，指令中有onClick函数。

但遗憾的是，在将已编译的html设置为div后， onClick 不再被调用。

var content = $compile(res)($scope);
$('dynamic-html').html(content);

我的dynamicHTML指令如下所示：

.directive('dynamicHtml', function($compile, $timeout) {
  return {
    restrict: 'E',
    transclude: true,
    link: function($scope, $element) {
      $scope.datePickers = {};

      $scope.onClick = function (variable, $event) {
        var currentTarget = $event.currentTarget;

          $scope.$parent.$parent.highlight(variable, true, currentTarget);
      };

我试图在指令上添加transclude，你可以看到。但它不适用于这种情况。你能指导我解决这个问题吗？

Answer 1

请查看以下代码，

angular.module("myApp", [])

  .directive("compiled", function($compile){
    return {
      restrict: "AE",
      scope: {},
      link: function(scope, ele, attrs){
          var compiled = $compile("<div><hello-world></hello-world></div>")(scope);
          ele.replaceWith(compiled);
      }
    }
  })

  .directive("helloWorld", function(){
    return {
      restrict: "AE",
      scope: {},
      transculde: true,
      link: function(scope, ele, attrs){
        scope.sayhello = function(){
          alert("Hello World");
        }
      },
      template: '<button ng-click="sayhello()">Say Hello</button>'
    }
  })

<强> HTML

<compiled></compiled>

将编译后的html设置为div后，ng-directive无法正常工作

1 个答案: