angularJs Error: [ng:areq] Argument ‘fn‘ is not a function, got undefined

最新推荐文章于 2023-03-06 17:04:39 发布
最新推荐文章于 2023-03-06 17:04:39 发布
阅读量3.1k 收藏 3
点赞数 3
分类专栏： AngularJs 文章标签： javascript angularjs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ws9029/article/details/108469438
版权

今天做项目，重构一个组件的时候，无端报了一个这样的错！Error: [ng:areq] Argument ‘fn’ is not a function, got undefined,花了我很久的时间才找到这个错误！原来是因为我注册的component组件时候出了问题！项目结构比较复杂，我直接用一个最简单的例子来说下！

<body>
    <div ng-app="App">
        <custom-tag>
        </custom-tag>
    </div>
</body>
<script>
    angular.module("App", []).component("customTag", {

        template: "123",
        bindings: {
            uploadConfig: '<',
        },
        controllerAs: 'ctrl',
        transclude: true,
        controller: ["test", function (test) {

        }]
    }).service("test", function () {

    })
</script>

上面的例子很简单，注册一个’customTag’component和一个’test’service,并且这个’customTag’component注入这个’test’service，上面的代码是没有问题，能正常跑，但是你注册的service找不到构造函数的话就有问题的（因为项目比较复杂，不会这样注册），下面我直接写个undefined,看下面代码！

<body>
    <div ng-app="App">
        <custom-tag>
        </custom-tag>
    </div>
</body>
<script>
    angular.module("App", []).component("customTag", {

        template: "123",
        bindings: {
            uploadConfig: '<',
        },
        controllerAs: 'ctrl',
        transclude: true,
        controller: ["test", function (test) {

        }]
    }).service("test", undefined)
</script>

这样就会报错：
在这里插入图片描述
今天也是碰到这个问题,顺便发下项目的注册方法！（项目比较复杂，今天的这个问题也是找了很久才发现）

uibuilderModule.js

var BLANK_MODULE = {
    states: [],
    components: {},
    directives: {},
    services: {},
    filters: {},
    configBlocks: [],
    runBlocks: [],
    providers: {},
    factories: {}
};

/**
 * @param ngModule `angular.module()`对象
 * @param appModule 由组件、状态、服务等组成的功能模块
 * @description 注册每个app模块的状态、指令、组件、过滤器和服务,使用' uibuilderModule '配置/运行模块
 */
var appStartModule = angular.module(nainAppName, moduleList);

function registrationModule(ngModule, appModule) {
    var module = Object.assign({}, BLANK_MODULE, appModule);

    Object.keys(module.components).forEach(function (name) {
        ngModule.component(name, module.components[name]);
    });

    Object.keys(module.directives).forEach(function (name) {
        ngModule.directive(name, module.directives[name]);
    });

    Object.keys(module.services).forEach(function (name) {
        ngModule.service(name, module.services[name]);
    });

    Object.keys(module.providers).forEach(function (name) {
        ngModule.provider(name, module.providers[name]);
    });

    Object.keys(module.filters).forEach(function (name) {
        ngModule.filter(name, module.filters[name]);
    });

    Object.keys(module.factories).forEach(function (name) {
        ngModule.factory(name, module.factories[name]);
    });

    module.configBlocks.forEach(function (configBlock) {
        ngModule.config(configBlock);
    });

    module.runBlocks.forEach(function (runBlock) {
        ngModule.run(runBlock);
    });

    return ngModule;
};

exports.registrationModule = registrationModule;
exports.uibuilderModule = appStartModule;

上面代码是最终注册的地方，下面是services，components，directives，providers等的对象集合

index.bootstrap.js

var mainAppModule = {
    services: {
        restService: restService.service,
        fileService: fileService.service,
        productInstanceService: productInstanceService.service,
        builderConfigsService: builderConfigsService.service,
        simplifyBomService: simplifyBomService.service,
        propertyModelService: propertyModelService.service,
        builderUserDesign: builderUserDesign.service,
        productService: productService.service,
        productConfigRuntimeRestService: productConfigRuntimeRestService.service,
        productInstanceRestService: productInstanceRestService.service,
        propertyModelInitializeManager: propertyModelInitializeManager.service,
        indexManager: indexManager.service,
        commonFactory: commonFactory.service,
        konvaFactory: konvaFactory.service,
        simplifyBomManager: simplifyBomManager.service,
        productInstanceInitializeManager: productInstanceInitializeManager.service,
        builderViewRuntimeManager: builderViewRuntimeManager.service,
        oldSBomNodeDataManager: oldSBomNodeDataManager.service,
        newSBomNodeDataManager: newSBomNodeDataManager.service,
        navigationManager: navigationManager.service,
        uploadVerify: uploadVerifyService.uploadVerify,
        builderViewRuntimeConver: builderViewConver.BuilderViewRuntimeConver,
        imageLibraryManager: imageLibraryManager.service,
        konvaManager: konvaManager.service,
        konvaEditBoardManager: konvaEditBoardManager.service,
        canvasPageManager: canvasPageManager.service,
        layerPageManager: layerPageManager.service,
        publicBoardManager: publicBoardManager.service,
        builderTextRestService: builderTextRestService.service,
        pageContentSchemaManager: pcsManager.PageContentSchemaManager,
        pageContentRuntimeManager: pcRuntimeManager.PageContentRuntimeManager,
        pcElementsManager: pcElementsManager.PCElementsManager,
        uniqueIdGenerator: uniqueIdGenerator.UniqueIdGenerator,
        canvasManager: canvasManagerFile.CanvasManager,
        pageContentSchemaConstraintManager: pcsConstraintManager.PageContentSchemaConstraintManager,
        /**
         * singleViewBoard
         */
        pageContentConverterService: pageContentConverter_service.pageContentConverter,
        transformToolService: transformTool_service.transformToolService,
        konvaElementDeleteService: konvaElementDelete_service.konvaElementDeleteService,
        konvaElementMoveService: konvaElementMove_service.konvaElementMoveService,
        konvaElementCenterService: konvaElementCenter_service.konvaElementCenterService,
        konvaBgColorPanelService: konvaBgColorPanel_service.konvaBgColorPanelService,
        konvaBgImagePanelService: konvaBgImagePanel_service.konvaBgImagePanelService,
        konvaFontPanelService: konvaFontPanel_service.konvaFontPanelService,
        konvaUserPictureService: konvaUserPicture_service.konvaUserPictureService,
        konvaTipOnService: konvaTipOn_service.konvaTipOnService,
        CommandHistoryService: commandHistory.CommandHistoryService,
        boardScale: boardScale_service.boardScale,
        boardScaleService: boardScale_service.boardScale,
        pageContentEditor: pageContentEditor_service.pageContentEditor,
        konvaToolBarService: konvaToolBar_service.konvaToolBarService,
        algorithm: algorithm_service.algorithm,
        publicBoardManager: publicBoardManager.service,
        immediatelyManager: immediatelyManager.service,
        detailManager: detailManager.service,
        templateConfigsService: templateConfigsService.service
    },
    components: {
        imageLibrary: imageLibraryComponent.imageLibrary,
        progressBar: progressBarComponent.progressBar,
        picListPanel: picListPanelComponent.picListPanel,
        filesUpload: filesUploadComponent.filesUpload,
        openLibraryButton: openLibraryButtonComponent.openLibraryButton,
        errorMessage: errorMessageComponent.errorMessage,
        errorTips: errorTipsComponent.errorTips,
        fontLibrary: fontLibraryComponent.fontLibrary,
        fontPanel: fontPanelComponent.fontPanel,
        h1NavBar: h1NavBar.h1NavBar,
        diceNavBar: diceNavBar.diceNavBar,
        /**
         * singleViewBoard
         */
        imageEditor: imageEditor_component.imageEditor,
        textEditor: textEditor_component.textEditor,
        imgBrightness: imgBrightness_component.imgBrightness,
        toolBar: toolBar_component.toolBar,
        imgFilter: imgFilter_component.imgFilter,
        fontEditor: fontEditor.fontEditor,
        onLoading: onLoading.onLoading,
        singleViewUploadEditBoard: singleViewUploadEditBoard.singleViewUploadEditBoard,
        templateDownload: templateDownload.templateDownload,
        pdfUpload: pdfUpload.pdfUpload,
        thirdErrorTips: thirdErrorTips.thirdErrorTips,
        filesUploadPdf:filesUploadPdf.filesUploadPdf
    },
    directives: {
        singleViewEditBoard: singleViewEditBoard.singleViewEditBoardDirective,
        /**
         * singleViewBoard
         */
        singleViewBoard: singleViewBoard_directive.singleViewBoard,
        imageView: imageView_directive.imageView,
        command: command_directive.CommandDirective,
        boardElementCentered: boardElementCentered_directive.boardElementCentered,
        boardElementMoveTier: boardElementMoveTier_directive.boardElementMoveTier,
        boardElementUndoRedo: boardElementUndoRedo_directive.boardElementUndoRedo,
        boardElementDelete: boardElementDelete_directive.boardElementDelete,
        imgTransformEdit: imgTransformEdit_directive.imgTransformEdit,
        imgScaleEdit: imgScaleEdit_directive.imgScaleEdit,
        boardElementDrag: boardElementDrag_directive.boardElementDrag
    },
    providers: {
        command: commandFactory_provider.CommandFactory
    },
    configBlocks: [commandConfigBlock]
};

uibuilderModule.registrationModule(uibuilderModule.uibuilderModule, mainAppModule);
世态炎凉！！
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Keil v5 Error: Encountered an improper argument 个人实测解决办法
04-20
在使用Keil μVision v5这款著名的嵌入式开发工具时，用户可能会遇到一个令人头疼的问题：“Error: Encountered an improper argument”。这个错误通常在编译或调试过程中出现，导致程序无法正常运行或者调试器无法...
Error: Encountered an improper argument 官方解决办法
11-14
Download the attached file and... If you have installed PK51 to a different folder, you need to adapt the path accordingly. The file UV4.exe is replaced with version 5.14.2.1. 亲测可以在win10和5.24中使用
fn.bind is not a function，消除行内块级元素之间的距离
weixin_33790053的博客
09-17 1060
fn.bind is not a function // 可能是methods里面放了格式不正确的函数 消除行内块级元素之间的距离 //1 html结构紧贴 2 父级元素font-size: 0px;复制代码 转载于:https://juejin.im/post/5b9b92405188255c6f1e0c5a...
Uncaught (in promise) TypeError: fn is not a function at callWithErrorHandling以及vue2、vue3的一些不同
qi__lu的博客
03-06 837
问题报错
react学习(30)---uncaught at check call: argument fn is undefined
歌谣的博客
07-15 2264
出现这个报错是当前的dva.js的一个接口没有成功调用
用angularjs 模块时Error: [ng:areq] Argument 'controller' is not a function,
荒野之鹰
05-28 1万+
今天学习angular时，发生了这个错误，网上大多数是说，不能直接用function写controller了，要用module，但我就是用的module啊代码如下:js ： var mainApp = angular.module("mainApp",[]); mainApp.controller("controller",function($scope){ $scope.student={
Argument 'xxx' is not a function, got undefined,初学Angular的第一个坑
weixin_30830327的博客
01-15 204
　　终于考完试了，在没更新的这一段时间里，一直都在忙于应付考试。不过在期间也是接触到不少好玩的东西，比如Html5的Canvas，我用lufylegend的Html5引擎做了个《看你有所色》的游戏。还有最近刚开始玩的Angular。 　　Angular也是早有听说了啊，一直没闲下功夫研究，趁着放假，学一学。慕课网（www.imooc.com）里有一套教程，还是很不错的。但是真正上手编码的时候就发...
JS中常见的 “函数名 is not a function” 错误
热门推荐
weixin_40345099的博客
09-30 26万+
js中常见的错误，例如Uncaught TypeError: x is not a function 其原因除了函数本身有错之外，还有一种很奇怪的情况：函数本身没有错，但是运行时就是不能正常运行。这种情况与javascript的特性有关：变量与函数声明前置的优先级。 首先看代码： console.log(x) console.log(x()); var x=1; function x(){...
Error response from daemon: rpc error: code = FailedPrecondition
01-08
Error response from daemon: rpc error: code = FailedPrecondition desc = node y2qsyjdbfmm4tjwh4p9wqlmq1 is not down and can’t be removed 解决(需要把active状态的节点的docker服务关闭;同时在manager节点中...
解决TypeError: fn.bind is not a function
weixin_41821317的博客
11-25 1184
一、问题描述 二、socket.io 版本@2.0.3 "socket.io": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-2.0.3.tgz", "integrity": "sha1-Q1nwaiSTOua9CHeYr3jGgOrjReM=", "requires": { "debug": "~2.6.6",
【小程序】 解决 Function(...) is not a function问题
不忘初心，坚定道路！
07-22 1万+
在小程序中，只要写了ayncawait（或者是你引入的库中写了），如果你使用了babel编译且babel的版本大于7，则会出现这个问题。
angularjs出现[ng:areq]错误
wlopper的博客
11-23 1300
今天运行项目是出现了angular.min.js:80 Error: [ng:areq] http://errors.angularjs.org/1.2.9/ng/areq?p0=sellerController&p1=not%20a%20function%2C%20got%20undefined 这种错误,经过查询后发现是ng-controller写错了,应该写成searchContro...
AngularJs1使用中出现错误 Error: [ng:areq]
weixin_30470857的博客
08-27 227
1、没有对应的控制器 2、有控制器但是路径没有配对 转载于:https://www.cnblogs.com/muou2125/p/9543216.html
angular Error: [ng:areq]
dexia7362的博客
06-08 140
在使用augularjs的时候，爆了个错误： 后来经过对比，原来是我的<html>标签多了点东西 转载于:https://www.cnblogs.com/guxingzhe/p/5569091.html
AngularJS Error: [ng:areq] loginController is not a function
0808xyj的专栏
08-24 1557
场景： AngularJS做 登录页面，单独 引 JQuery 和 AngularJS 文件 webapp/ |---lib/ |------angular/ |---------angular.min.js |------jquery/ |---------jquery.min.js |----------login.html |----------login.js l
解释一下Error: ng:areq Bad Argument Argument 'BasicsIndexController' is not a function, got undefined
最新发布
06-03
在具体的错误信息中，"Argument 'xxx' is not a function, got undefined" 表示AngularJS无法找到名为“xxx”的函数。 可能的原因包括： 1. 控制器函数未正确定义或命名，导致AngularJS无法识别它。 2. 控制器...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值