错误:[$ controller:ctrlreg]未注册角度控制器

时间:2018-06-29 20:17:02

标签: angularjs

我尝试了很多方法,但是我不确定我丢失了什么,我在控制台中看到控制器名称未注册错误。

我甚至试图更改控制器的名称,但仍然没有运气

请建议

AngularController.js

(function () {
    'use strict';

    angular
        .module('mymod')
        .controller('controller', controller);

    controller.$inject = ['$location'];

    (function ($) {
        $.fn.menumaker = function (options) {
            var cssmenu = $(this), settings = $.extend({
                format: "dropdown",
                sticky: false
            }, options);
            return this.each(function () {
                $(this).find(".button").on('click', function () {
                    $(this).toggleClass('menu-opened');
                    var mainmenu = $(this).next('ul');
                    if (mainmenu.hasClass('open')) {
                        mainmenu.slideToggle().removeClass('open');
                    }
                    else {
                        mainmenu.slideToggle().addClass('open');
                        if (settings.format === "dropdown") {
                            mainmenu.find('ul').show();
                        }
                    }
                });
                cssmenu.find('li ul').parent().addClass('has-sub');
                multiTg = function () {
                    cssmenu.find(".has-sub").prepend('<span class="submenu-button"></span>');
                    cssmenu.find('.submenu-button').on('click', function () {
                        $(this).toggleClass('submenu-opened');
                        if ($(this).siblings('ul').hasClass('open')) {
                            $(this).siblings('ul').removeClass('open').slideToggle();
                        }
                        else {
                            $(this).siblings('ul').addClass('open').slideToggle();
                        }
                    });
                };
                if (settings.format === 'multitoggle') multiTg();
                else cssmenu.addClass('dropdown');
                if (settings.sticky === true) cssmenu.css('position', 'fixed');
                resizeFix = function () {
                    var mediasize = 1000;
                    if ($(window).width() > mediasize) {
                        cssmenu.find('ul').show();
                    }
                    if ($(window).width() <= mediasize) {
                        cssmenu.find('ul').hide().removeClass('open');
                    }
                };
                resizeFix();
                return $(window).on('resize', resizeFix);
            });
        };
    })(jQuery);

    (function ($) {
        $(document).ready(function () {
            $("#cssmenu").menumaker({
                format: "multitoggle"
            });
        });
    })(jQuery);
})();

Directive.js

此指令创建为可在基本页上调用

(function () {
    'use strict';

    angular.module('mymod')
     .directive('myDirective', function () {
         return {
             restrict: 'E', //E = element, A = attribute, C = class, M = comment         
             scope: true,
             //templateUrl: 'Views/Directives/Header/mytemplate.html',
             templateUrl: '../Views/Directives/MainHeader/mytemplate.html',

             //template: '<h1>Hello Directive: {{vm.title}}</h1>',
             controller: 'controller',
             controllerAs: 'vm'
         }
     });

})();

下面显示的图像是错误消息信息

enter image description here

1 个答案:

答案 0 :(得分:1)

通过具有依赖项数组和模块初始化来更新代码。将您的代码更新为:

(function () {
    'use strict';

    angular
        .module('mymod', [])
        .controller('controller', controller);

    controller.$inject = ['$scope', '$location'];
    function controller($scope, $location) {
        //Write controller code here
    }

然后将您的指令代码更新为:

(function () {
    'use strict';

    angular.module('mymod')
     .directive('myDirective', function () {
         return {
             restrict: 'E', //E = element, A = attribute, C = class, M = comment         
             scope: true,
             //templateUrl: 'Views/Directives/Header/mytemplate.html',
             templateUrl: '../Views/Directives/MainHeader/mytemplate.html',

             //template: '<h1>Hello Directive: {{vm.title}}</h1>',
             controller: controller,
             controllerAs: 'vm'
         }
     });

})();

如果要在angularjs应用程序中使用jquery,请确保在angularjs lib之前注入它(index.html上的脚本标签)。

Demo Example

相关问题