ng-директива не работает после установки скомпилированного html в div - PullRequest
0 голосов
/ 28 апреля 2018

Перед установкой скомпилированного 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 в директиву, как вы можете видеть. Но это не работает в этом случае. Можете ли вы помочь мне решить эту проблему?

1 Ответ

0 голосов
/ 28 апреля 2018

Проверьте следующий код,

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>
...