AngularJS:未调用指令函数

Question

从来没有调用我提供的用于定义我的指令的函数.它过去工作正常但突然停止工作,我不知道为什么.

这是我的指示:

portalApp.directive('contactPanel', function () {
    console.log("NEVER SHOWN!");
    return {
        restrict: 'AE',
        replace: 'true',
        templateUrl: 'partials/account/contactPanel.html',
        scope: {
            contact: '=contact',
            primaryRoleName: '@',
            roleName: '@',
            primary: '=primary',
            locations: '=locations'
        },
        controller: function (userService, $rootScope, $scope) {
            ...snip...
        }
    };
});

这里是一个使用示例:

<contact-panel contact="user.account.contacts.billing" role-name="billing"
               locations="locations"></contact-panel>

请注意,我使用的是正确的大小写,即JS中的camel-case和HTML中的连字符.

关键线索是,第二行中记录的消息(即"从不显示!")从未显示在控制台中.如果我在指令声明之前立即记录消息然后显示,那么解释器正在执行此代码,但框架永远不会使用我的声明.

我很想得到明显的答案,但我也很想听听调试这类问题的一些方法.

Answer 1

我只能看到两种可能表现出你所描述的行为的可能性.带有指令的HTML未编译或指令未注册.

在"未编译"情况可能是因为指令使用的角度应用程序之外,例如:

<div ng-app="portalApp">
 ...
</div>
...
<contact-panel></contact-panel>

或者,如果您动态添加HTML,但没有$compile并链接它.

在"未注册"情况可能是由于重新注册该应用程序的模块.换句话说,您可能会遇到以下情况:

var portalApp = angular.module("portalApp", []);
portalApp.directive("contactPanel", function(){...});

// then elsewhere you use a setter:

angular.module("portalApp", []).controller("FooCtrl", function(){});    
// instead of the getter:
// var app = angular.module("portalApp");

第二次调用angular.module("portalApp", [])删除以前的注册.directive("contactPanel", ....