Question

为什么我的角度指令不受约束？

(function() {
    'use strict';

    app.directive('projectSearchModal', projectSearchModal);

    projectSearchModal.$inject = ['$modal', '$scope', 'ProjectService'];

    function projectSearchModal($modal, $scope, ProjectService) {
        // Usage:
        //     <projectSearch></projectSearch>
        // Creates:
        // 
        var directive = {
            link: link,
            restrict: 'A',
            scope: {
                project: '=',
                finishCallback: '=',
                comment: '='
            }
        };
        return directive;

        function link(scope, element, attrs) {}
})()

以下是我的称呼方式：

<button project-search-modal="" project="project" finish-callback="wipeProjectInfoFromComment" comment="currentstakeholdercomment"
                                                     class="btn btn-primary"><i class="glyphicon glyphicon-search"></i> Search Projects</button>

该指令肯定会进入浏览器但是没有被执行（即我在链接定义上设置断点并且它从未被命中）

Answer 1

你的指令问题（除了缺少}，我猜它是复制粘贴错误）是你试图将不存在的服务$scope注入指令。它没有意义，因为$scope不是可共享的服务，你可以注入指令/其他服务，因为它绑定到特定的HTMLElements。所以Angular会抛出错误。

您不需要$scope，因为您已经有一个可用的链接功能。

更正指令定义：

(function() {
    'use strict';

    app.directive('projectSearchModal', projectSearchModal);

    function projectSearchModal($modal, ProjectService) {
        var directive = {
            link: link,
            restrict: 'A',
            scope: {
                project: '=',
                finishCallback: '=',
                comment: '='
            }
        };
        return directive;

        function link(scope, element, attrs) {
            console.log('link');
        }
    }

    projectSearchModal.$inject = ['$modal', 'ProjectService'];
})();

Answer 2

好的，事实证明我没有将一个模块（包含该指令）添加到正确的MVC布局页面（其中有一堆浮动在这个项目中）。

angular指令没有被绑定到视图

2 个答案: