Angular 指令的 link 函数未被调用

Question

AngularJS 指令 link 函数有问题。它没有被调用，也不会抛出任何错误。此外，指令 return 中的模板未呈现 :( 问题应该在哪里？谢谢您的回答！

angular.module('sampleApp.game').directive('gameCanvas', function($injector) {      
    console.log('Directive is working'); // this works,

    function linkFn(scope, ele, attrs) {
        console.log('Link function doesnt working :('); // but this not :(
    };

    return {
        scope: {},
        template: '<div class="blabla"></div>',
        link: linkFn
    }   
});

我的html模板文件

<div class="jumbotron text-center">
    <h1>Play a game!</h1>
    <p>{{ tagline }}</p>   
    <div class="game-canvas"></div>
</div>

Answer 1

默认情况下，指令仅适用于元素和属性 ('EA')。将限制属性定义为 'C'。最佳做法是始终明确定义它。

angular.module('sampleApp.game').directive('gameCanvas', function($injector) {      
console.log('Directive is working'); // this works,

function linkFn(scope, ele, attrs) {
    console.log('Link function doesnt working :('); // but this not :(
};

return {
    scope: {},
    restrict: 'C', //'EA' by default
    template: '<div class="blabla"></div>',
    link: linkFn
}

});

由 Angular 记录在此处 - https://docs.angularjs.org/api/ng/service/$compile#directive-definition-object。

Angular 指令的 link 函数未被调用

Angular directive's link function not being called

javascript

angularjs

angularjs-directive