当控制器存在时,angularjs链接功能不执行

时间:2016-03-26 01:34:29

标签: javascript angularjs angularjs-directive

我现在有点困惑。我写了一个指令,基本上根据一些" status"打开不同的模态。 出于某种原因,"链接"功能不再执行,它回来了一段时间。我不知道它何时停止工作。也许一些解决不好的合并冲突,也许是一些有点小的更新? 希望任何人都能帮助我提示我正确的方向。

调用

链接函数,其中不存在控制器,否则不执行。注释掉控制器的逻辑也不会导致链接的执行。

<hcd-modal-messages status="status" redirect="app.dashboard.index"></hcd-modal-messages>

指令:

angular
    .module('hcdProtocol')
    .directive('hcdModalMessages', function () {
        return {
            restrict: 'E',
            templateUrl: 'app/protocols/components/modalMessages/modalMessages.html',
            scope: {
                labelSuccess: '@labelSuccess',
                labelProcess: '@labelProcess',
                labelFailed: '@labelFailed',
                labelCached: '@labelCached',
                status: '=status', //values: HIDDEN, PROCESS, SUCCESS, FAIL
                redirect: '=redirect',
                delay: '@redirectDelay' //delay in milliseconds
            },
            controller: ['$scope', '$timeout', '$state', function($scope, $timeout, $state) {
            $scope.processModal = new Foundation.Reveal(
                angular.element(angular.element(".modal-process")[0]),
                {
                    closeOnClick: false
                }
            );
            $scope.successModal = new Foundation.Reveal(
                angular.element(angular.element(".modal-success")[0]),
                {
                    closeOnClick: false
                }
            );
            $scope.failModal = new Foundation.Reveal(
                angular.element(angular.element(".modal-fail")[0]),
                {
                    closeOnClick: true
                }
            );
            $scope.offlineModal = new Foundation.Reveal(
                angular.element(angular.element(".modal-cached")[0]),
                {
                    closeOnClick: false
                }
            );

            $scope.$watch('status', function(status) {
                //close all modals
                $scope.processModal.close();
                $scope.successModal.close();
                $scope.failModal.close();
                //open modal corresponding to current status
                switch(status) {
                    case 'PROCESS':
                        $scope.processModal.open();
                        break;
                    case 'SUCCESS':
                        $scope.successModal.open();

                        if(typeof $scope.redirect !== 'undefined') {
                            //delay redirection
                            $timeout(function () {
                                $state.go($scope.redirect);
                            }, $scope.redirectDelay);
                        }
                        break;
                    case 'OFFLINE_CACHED':
                        $scope.offlineModal.open();

                        if(typeof $scope.redirect !== 'undefined') {
                            //delay redirection
                            $timeout(function () {
                                $state.go($scope.redirect);
                            }, $scope.redirectDelay);
                        }
                        break;
                    case 'FAIL':
                        $scope.failModal.open();
                        break;
                }
            });

            }],
            link: function(scope, element, attrs, controller, transcludeFn) {
                //set default label
                if(typeof attrs.labelProcess == 'undefined') scope.labelProcess = "Creating new protocol";
                if(typeof attrs.labelSuccess  == 'undefined') scope.labelSuccess = "successfully created";
                if(typeof attrs.labelFailed  == 'undefined') scope.labelFailed = "creation failed";
                if(typeof attrs.labelCached  == 'undefined') scope.labelCached = "Created in offline cache";

                scope.redirectDelay = (typeof attrs['redirect-delay']  === 'undefined') ? 3000 : attrs['redirect-delay'];
                scope.redirect = (typeof attrs.redirect === 'undefined') ? false : attrs.redirect;

                //close modals when directive ist destroy to avoid grey (ui blocking) overlay
                scope.$on('$destroy', function() {
                    scope.processModal.close();
                    scope.failModal.close();
                    scope.successModal.close();
                    scope.offlineModal.close();
                });
            }
        }
    });

我目前正在使用AngularJS v1.5.3

我的快速修复:我最终将控制器逻辑放入链接功能。其中大部分都属于那里。所以它现在正在工作,因为我没有控制器,但我仍然不知道为什么在我的情况下没有执行控制器和链接。

1 个答案:

答案 0 :(得分:0)

使用此格式

angular
    .module('module')
    .controller('MyCtrl',/*your controller*/)
    .directive('myDirective', function() {
        return {
            require: '^^MyCtrl',
            link: function (scope, el, attrs, MyCtrl) /*....*/
        }
    })