Question

我有一条指令，将从CMS提取的一些HTML转换成我的AngularJS应用。当我在指令中添加脚本标记并向其添加控制台消息时，该消息被记录两次。

这是我的指令：

<IfModule mod_ssl.c>
    <VirtualHost *:80>
        ServerName your-server.name
        Redirect permanent / https://your-server.name
    </VirtualHost>

    <VirtualHost _default_:443>
        ServerName your-server.name
        ...

我使用它的方式是：

angular.module('my-directive', [])
  .directive('myDirective', function () {
    return {
      restrict: 'E',
      replace: false,
      transclude: true,
      template: '<section class="my-directive" ng-transclude> 
         </section>'
    };
  });

预期结果：“ ABCD”记录一次。

实际结果：“ ABCD”记录了两次。

谁能解释为什么会这样？

Answer 1

document.load上的答案第一次出现<script>...</script>用完了指令，这完全不取决于指令。

第二次加载您的指令，因此您有两次控制台。

如果要检查，请使用$timeout延迟加载模板：

打开浏览器控制台

        return {
            restrict: 'E',
            replace: false,
            transclude: true,
            template: '<section ng-transclude ng-if="run"></section>',
            link: function (scope) {
                $timeout(function () {
                    scope.run = true
                }, 2000)
            }
        };

如何解决此问题？

指令中不需要script！ ，如果您要为每个指令自定义脚本，则是另一个问题。

在指令中将脚本放在link上：

    return {
        restrict: 'E',
        replace: false,
        transclude: true,
        template: '<section ng-transclude ng-if="run"></section>',
        link: function (scope) {
            //----your scripts
            console.log("ABCD");
        }
    };

使用ng-transclude从指令的HTML模板执行了两次脚本标记

1 个答案: