为什么不是'；我的AngularJS应用程序&x27；s指令链接方法触发？_Angularjs_Angularjs Directive

为什么不是'；我的AngularJS应用程序&x27；s指令链接方法触发？

angularjs

为什么不是'；我的AngularJS应用程序&x27；s指令链接方法触发？,angularjs,angularjs-directive,Angularjs,Angularjs Directive,我正在向元素添加$HTTPRetrieved、$compile-d模块HTML。链接和编译方法没有启动。我做错了什么我尝试了许多不同的方法将模块放入页面，使用和不使用ng repeat，并且我能够呈现模块的视图，初始指令工厂函数启动，但链接和编译函数没有 HTML: JavaScript: var ROOT_URL = "/"; angular.module("app") .directive("modules", ["$q", "$http", "$templateCache"

我正在向元素添加$HTTPRetrieved、$compile-d模块HTML。链接和编译方法没有启动。我做错了什么

我尝试了许多不同的方法将模块放入页面，使用和不使用ng repeat，并且我能够呈现模块的视图，初始指令工厂函数启动，但链接和编译函数没有

HTML:

JavaScript:

var ROOT_URL = "/";

angular.module("app")
    .directive("modules", ["$q", "$http", "$templateCache", "$compile", function ($q, $http, $templateCache, $compile) {
        "use strict";

        return {
            restrict: "A",
            replace: true,
            template: "<div id=\"module-list\"></div>",

            link: function($scope, $element, $attrs) {
                var moduleHtml = "";

                var getModuleHtml = function(moduleData) {
                    var moduleName = moduleData.directive;
                    var moduleUrlBase = ROOT_URL + "views/directives/";
                    var defer = $q.defer();
                    var moduleUrl;

                    // convert hyphens to camel-case
                    moduleName = moduleName.replace(/-([a-z])/g, function (g) {
                        return g[1].toUpperCase();
                    });
                    moduleUrl = moduleUrlBase + moduleName + ".html";
                    $http.get(moduleUrl)
                        .success(function(moduleHtml) {
                            defer.resolve(moduleHtml);
                        });

                    return defer.promise;
                };

                var addModuleToPage = function(moduleData) {
                    //$scope.$apply($element.append("<div module " + $scope.modules[i].directive + " ></div>"));
                    getModuleHtml(moduleData).then(function(moduleHtml) {
                        moduleHtml = angular.element(moduleHtml);
                        $element.append($compile(moduleHtml)($scope.$new(true)));
                    });
                };

                $scope.$watch("modules", function() {
                    if ($scope.modules && $scope.modules.length) {
                        for (var i = 0, modulesLen = $scope.modules.length; i < modulesLen; i++) {
                            if (typeof $scope.modules[i].directive !== "undefined") {
                                addModuleToPage($scope.modules[i]);
                            }
                        }
                    }
                });
            }
        };
    }])
    .directive("module", [function () {
        "use strict";

        return {
            restrict: "A",
            replace: false,
            scope: {}
        };
    }])
    .directive("hero", [function () {
        "use strict";
        console.log("factory");

        return {
            templateUrl: ROOT_URL + "views/directives/eventP1.html",
            restrict : "A",
            replace : true,
            transclude : false,
            require : "module",

            compile: function() {
                console.log("compile");
            }
        };
    }]
);

var ROOT_URL=“/”；
角度模块（“应用程序”）
.directive（“模块”、[“$q”、“$http”、“$templateCache”、“$compile”、函数（$q、$http、$templateCache、$compile）{
“严格使用”；
返回{
限制：“A”，
替换：正确，
模板：“”，
链接：函数（$scope、$element、$attrs）{
var moduleHtml=“”；
var getModuleHtml=函数（moduleData）{
var moduleName=moduleData.directive；
var moduleUrlBase=ROOT_URL+“视图/指令/”；
var defer=$q.defer（）；
var模数；
//将连字符转换为驼峰大小写
moduleName=moduleName.replace（/-（[a-z]）/g，函数（g）{
返回g[1]。toUpperCase（）；
});
moduleUrl=moduleUrlBase+moduleName+“.html”；
$http.get（moduleUrl）
.成功（功能（模块HTML）{
延迟解决（moduleHtml）；
});
回报、承诺；
};
var addModuleToPage=函数（moduleData）{
//$scope.$apply（$element.append（“”））；
getModuleHtml（moduleData）。然后（函数（moduleHtml）{
moduleHtml=角度元素（moduleHtml）；
$element.append（$compile（moduleHtml）（$scope.$new（true））；
});
};
$scope.$watch（“模块”，函数（）{
if（$scope.modules&&$scope.modules.length）{
对于（var i=0，modulesLen=$scope.modules.length；i



使用AngularJS 1.0.5.
我无法修复小提琴，因为我不知道最终结果是什么，但你的小提琴的问题是
缺少ng应用程序定义
<body ng-app="eventsApp">

在这里查看我更新的fiddle你是否输入'link:function'？@MaximShoustin不，它什么都不做——我在那里输入的console.log（）调用没有启动。
<body ng-app="eventsApp">

angular.module("eventsApp",[])