且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

控制器不是一个函数,得到了不确定的,而全球范围内定义控制器

更新时间:2023-02-18 22:22:56

通过角1.3+,你可以不再使用对全球范围的全局控制器声明(如果没有显式注册)。您需要注册使用 module.controller 语法控制器。

例如: -

  angular.module(应用,[])
    .controller('的ContactController',['$范围,功能的ContactController($范围){
        $ scope.contacts = [abcd@gmail.com,abcd@yahoo.co.in];        $ scope.add =功能(){
            $ scope.contacts.push($ scope.newcontact);
            $ scope.newcontact =;        };
    }]);

 函数的ContactController($范围){
    $ scope.contacts = [abcd@gmail.com,abcd@yahoo.co.in];    $ scope.add =功能(){
        $ scope.contacts.push($ scope.newcontact);
        $ scope.newcontact =;
    };
}
。ContactController中注入$ ='$范围'];
angular.module('应用',[])控制器('的ContactController',ContactController中)。

有断裂的变化,但它可以被关闭以使用全局 allowGlobals

例如: -

  angular.module(应用)
    的.config(['$ controllerProvider',函数($ controllerProvider){
        $ controllerProvider.allowGlobals();
    }]);

下面是角源注释: -


  

      
  • 检查是否与给定名称的控制器通过 $ controllerProvider 注册

  •   
  • 检查评估对当前范围字符串返回构造

  •   
  • 如果$ controllerProvider#allowGlobals,检查窗口[构造] 对全球窗口对象(不推荐)

  •   

块引用>
  .....前pression = controllers.hasOwnProperty(构造函数)
            ?控制器[构造]
            :吸气剂(当地人$范围,构造,真)||
                (?全局吸气剂($窗口,构造,真):未定义);

一些额外的检查: -


  • 做确保把APPNAME在 NG-应用指令的角根元素(如: - HTML ),以及。例如: - NG-应用=对myApp


  • 如果一切正常,你仍然得到问题,千万记得要确保你有包含在脚本中正确的文件。


  • 您还没有在不同的地方,这导致在同一模块上定义previously的任何实体定义同一模块两次被清理出局,例如 angular.module(应用 ,[])。控制器(.. ,又在另一个地方 angular.module(应用,[])。服务(.. (与包括当然两者的脚本)会导致previously注册控制器模块应用要与模块的第二娱乐清除出去。


I am writing a sample application using angularjs. i got an error mentioned below on chrome browser.

Error is

Error: [ng:areq] http://errors.angularjs.org/1.3.0-beta.17/ng/areq?p0=ContactController&p1=not%20a%20function%2C%20got%20undefined

Code

<!DOCTYPE html>
<html ng-app>
<head>
    <script src="../angular.min.js"> </script>
    <script type="text/javascript">
        function ContactController($scope) {
            $scope.contacts = ["abcd@gmail.com", "abcd@yahoo.co.in"];

            $scope.add = function() {
                $scope.contacts.push($scope.newcontact);
                $scope.newcontact = "";

            };
        }

    </script>

</head>

<body>

    <h1>  modules sample </h1>

    <div ng-controller="ContactController">
        Email:<input type="text" ng-model="newcontact">
        <button ng-click="add()">Add</button>

        <h2> Contacts </h2>
        <ul>
            <li ng-repeat="contact in contacts"> {{contact}} </li>
        </ul>

    </div>
</body> 
</html>

With Angular 1.3+ you can no longer use global controller declaration on the global scope (Without explicit registration). You would need to register the controller using module.controller syntax.

Example:-

angular.module('app', [])
    .controller('ContactController', ['$scope', function ContactController($scope) {
        $scope.contacts = ["abcd@gmail.com", "abcd@yahoo.co.in"];

        $scope.add = function() {
            $scope.contacts.push($scope.newcontact);
            $scope.newcontact = "";

        };
    }]);

or

function ContactController($scope) {
    $scope.contacts = ["abcd@gmail.com", "abcd@yahoo.co.in"];

    $scope.add = function() {
        $scope.contacts.push($scope.newcontact);
        $scope.newcontact = "";
    };
}
ContactController.$inject = ['$scope'];
angular.module('app', []).controller('ContactController', ContactController);

It is a breaking change but it can be turned off to use globals by using allowGlobals.

Example:-

angular.module('app')
    .config(['$controllerProvider', function($controllerProvider) {
        $controllerProvider.allowGlobals();
    }]);

Here is the comment from Angular source:-

  • check if a controller with given name is registered via $controllerProvider
  • check if evaluating the string on the current scope returns a constructor
  • if $controllerProvider#allowGlobals, check window[constructor] on the global window object (not recommended)

 .....

expression = controllers.hasOwnProperty(constructor)
            ? controllers[constructor]
            : getter(locals.$scope, constructor, true) ||
                (globals ? getter($window, constructor, true) : undefined);

Some additional checks:-

  • Do Make sure to put the appname in ng-app directive on your angular root element (eg:- html) as well. Example:- ng-app="myApp"

  • If everything is fine and you are still getting the issue do remember to make sure you have the right file included in the scripts.

  • You have not defined the same module twice in different places which results in any entities defined previously on the same module to be cleared out, Example angular.module('app',[]).controller(.. and again in another place angular.module('app',[]).service(.. (with both the scripts included of course) can cause the previously registered controller on the module app to be cleared out with the second recreation of module.