angular.js:10126错误:[ng:areq]参数[...]不是函数,未定义

时间:2017-09-26 12:49:41

标签: javascript jquery angularjs requirejs

我知道它重复但我的工作没有。我搜索了很多。 我希望使用requirejs加载控制器的某些页面的角度路由失败

app.js

define("app", ['angular', 'angularUiBootstrap'], function () {

var app = angular.module('app', ['ngCookies', 'ngRoute']);

app.config(['$controllerProvider', '$compileProvider', '$filterProvider', '$provide',
    function ($controllerProvider, $compileProvider, $filterProvider, $provide) {

    }]);

    return app;

});

routing.js

define('routing', ['app', 'safeApply'], function (app) {

app.factory('api', function ($http, $cookies) {
    return {
        init: function (token) {
            debugger;
            $http.defaults.headers.common['X-Access-Token'] = token || $cookies.token;
        }
    };
});
/////////////////////////////
app.factory('httpInterceptor', function httpInterceptor($q, $window, $location) {
    return function (promise) {
        var success = function (response) {
            return response;
        };

        var error = function (response) {
            if (response.status === 401) {
                $location.url('/login');
            }

            return $q.reject(response);
        };

        return promise.then(success, error);
    };
});
/////////////////////////

app.config(function ($routeProvider, $locationProvider, $httpProvider, $provide) {


    var routingCfg =
        [
            { path: '/', controller: 'MainPageController', isFree: true, category: 'User', actionUrl: '/Home/MainPage' },
            { path: '/UploadNationalCard2', controller: 'UploadNationalCardController2', isFree: true, category: 'User', actionUrl: '/UploadNationalCard/Index' },
            { path: '/SmsReply', controller: 'SmsReplyJsController', isFree: true, category: 'User', actionUrl: '/SmsReply/Index' },
            { path: '/Support', controller: 'SupportController', isFree: true, category: 'User', actionUrl: '/Support/Index' },
            { path: '/Rule', controller: 'RuleController', isFree: true, category: 'User', actionUrl: '/Rule/Index' },
            { path: '/Api', controller: 'ApiController', isFree: true, category: 'User', actionUrl: '/Api/Index' },
            { path: '/Language', controller: 'LanguageController', isFree: true, category: 'User', actionUrl: '/Language/Index' },
            { path: '/About', controller: 'AboutController', isFree: true, category: 'User', actionUrl: '/About/Index' },
        ];

    routingCfg.forEach(function (x) {



        $routeProvider.when(x.path, {

            templateUrl: x.actionUrl,
            controller: x.controller,
            resolve: {
                load: ['$q', '$rootScope', 'safeApply', '$location', function ($q, $rootScope, safeApply, $location) {

                    var deferred = $q.defer();
                    require([x.controller], function () {

                        safeApply($rootScope, function () {
                            deferred.resolve();
                        });

                    });
                    return deferred.promise;

                }]
            }

        });
        $routeProvider.otherwise({
            redirectTo: '/'
        });
    });

});

    return app;

});

requirejsConfig.js

/// <reference path="routing.js" />
require.config({
baseUrl: '/',
urlArgs: 'v=1.0',
skipDataMain: true,

paths: {

    bootstrap: 'Scripts/bootstrap.min',
    jquery: 'Scripts/jquery-1.10.2.min',
    angular: 'Scripts/angular-1.4.7/angular',
    angularRoute: 'Scripts/angular-1.4.7/angular-route',
    angularCookies: 'Scripts/angular-1.4.7/angular-cookies',

    angularUiBootstrap: 'app/lib/ui-bootstrap/ui-bootstrap-tpls-0.10.0.min',

    app: 'app/js/app',
    routing: 'app/js/routing',
    safeApply: 'app/js/safeApply',

    serviceBaseAngular: 'app/js/serviceBaseAngular',
    UserPageController: 'app/user/UserPageController',
    MainPageController: 'app/user/MainPageController',
    UploadNationalCardController2: 'app/user/UploadNationalCardController2',
    SmsReplyJsController: 'app/user/SmsReplyJsController',


},

shim: {

    'bootstrap': ["jquery"],
    'angularUiBootstrap': ['angular'],
    'app': ['angular', 'angularRoute'],
    'angular': {
        deps: ["jquery"],
        exports: 'angular'
    },
    'angularRoute': ['angular'],
    'angularCookies': ['angular'],



},
});
require(
[
    'app',
    'routing',
    'jquery',
    'bootstrap',
    'angular',
    'angularUiBootstrap',
    'safeApply',
    'angularCookies',
    'angularRoute',
    'serviceBaseAngular',
    'UserPageController',
    'MainPageController',
    'UploadNationalCardController2'
    ],
function (app) {
    //app.init();
    angular.bootstrap(document, ['app']);

});

这是有效的,因为它位于reuirejsConfig.js

的require部分

MainPageController.js

define("MainPageController", ['app'], function (app) {
app.controller('MainPageController', ["$scope", "serviceBaseAngular", 
"$compile", "$timeout", "$location", "$rootScope", function ($scope, 
serviceBaseAngular, $compile, $timeout, $location, $rootScope) {

    }]);
});

MainPage.cshtml

<div ng-controller="MainPageController">
</div>

但是SmsReplyJsController.js无法正常工作

define('SmsReplyJsController', ['app'], function (app) {
app.controller('SmsReplyJsController', ["$scope", "$location", "$routeParams", "sharedServices", function ($scope, $location, $routeParams,  sharedServices) {

     }]);
});

我收到此错误

VM976:27 Error: [ng:areq] Argument 'SmsReplyJsController' is not a function, 
got undefined
 http://errors.angularjs.org/1.4.7/ng/areq?
 p0=SmsReplyJsController&p1=not%20aNaNunction%2C%20got%20undefined

表示

Error: ng:areq
Bad Argument
Argument 'SmsReplyJsController' is not a
Description
AngularJS often asserts that certain values will be present and truthy using     a helper function. If the assertion fails, this error is thrown. To fix this     problem, make sure that the value the assertion expects is defined and matches     the type mentioned in the error.

If the type is undefined, make sure any newly added     controllers/directives/services are properly defined and included in the     script(s) loaded by your page.

error-ngareq-from-angular-controller没有帮助我

任何帮助!谢谢

1 个答案:

答案 0 :(得分:0)

导致错误的行在safeApply.js

define("safeApply", ['app'], function (app) {

console.log('safeApply')

app.factory('safeApply', [function () {

    return function ($scope, fn) {

        var phase = $scope.$root.$$phase;

        if (phase == '$apply' || phase == '$digest') {
            if (fn && typeof fn === 'function') {
                $scope.$eval(fn);
            }
        } else {
            if (fn && typeof fn === 'function') {
                $scope.$apply(fn);
            } else {
                $scope.$apply();
            }
        }
    };
}]);
});

它是

if (fn && typeof fn === 'function') {
                $scope.$apply(fn);
            }

实际上在使用“$ scope。$ apply(fn);”加载控制器之后,使用safeApply首先加载依赖关系然后控制器的角度路由。发生错误

$routeProvider.when(x.path, {

        templateUrl: x.actionUrl,
        controller: x.controller,
        resolve: {
            load: ['$q', '$rootScope', 'safeApply', '$location', function ($q, $rootScope, safeApply, $location) {

                var deferred = $q.defer();
                require([x.controller], function () {

                    safeApply($rootScope, function () {
                        deferred.resolve();
                    });

                });
                return deferred.promise;

            }]
        }

    });

你能给我一些提示来解决它吗?

<强>解决

我为我的应用添加了懒惰

define("app", ['angular', 'angularUiBootstrap'], function () {
var app = angular.module('app', ['ui.bootstrap', 'ngRoute', 'ngCookies','ngAnimate']);

app.config(['$controllerProvider', '$compileProvider', '$filterProvider', '$provide', function ($controllerProvider, $compileProvider, $filterProvider, $provide) {
    app.lazy = {
        controller: $controllerProvider.register,
        directive: $compileProvider.directive,
        filter: $filterProvider.register,
        factory: $provide.factory,
        service: $provide.service
    };
}]);
return app;
});

和控制器如

define("NewContactController", ['app'], function (app) {
app.lazy.controller('NewContactController', ["$scope", "serviceBaseAngular", "sharedServices", "$compile", "$timeout", "$location", "$rootScope", "$routeParams", function ($scope, serviceBaseAngular, sharedServices, $compile, $timeout, $location, $rootScope, $routeParams) {



}]);
});