Onsen [ng:areq] 参数 '' 不是函数，未定义答案

【问题标题】：Onsen [ng:areq] Argument '' is not a function, got undefinedOnsen [ng:areq] 参数 '' 不是函数，未定义
【发布时间】：2016-04-12 21:03:01
【问题描述】：

我知道这个问题被问了大约一百次。我尝试了许多解决方案。遗憾的是，没有一个对我有用。

我正在使用 Onsen 和 AngularJS 进行编程。

HTML：

    <ons-template id="signin.html">
    <ons-dialog var="dialog">            
        <ons-toolbar>
            <div class="center">Log In</div>
        </ons-toolbar>

        <div class="login-form" ng-app="SignIn" ng-controller="SignCtrl">
            <input type="email" class="text-input--underbar" placeholder="Email" value="">
            <input type="password" class="text-input--underbar" placeholder="Password" value="">
            <br><br>
            <ons-button modifier="large" class="login-button">Log In</ons-button>
            <br>
            <ons-button modifier="quiet" class="forgot-password">Forgot password?</ons-button>
            <ons-button modifier="quiet" class="forgot-password" ng-click="showSignUp()">Not a member?</ons-button>
        </div>

    </ons-dialog>
</ons-template>

Javascipt (js/signctrl.js)：

(function(angular){
    // init functions
    'use strict';

    var app = angular.module('SignIn', []);
    app.controller('SignCtrl', function($scope) {
        $scope.showSignUp = function() {       
            alert("foo!");
            ons.createDialog('signup.html').then(function(dialog) { dialog.show(); });
        };
    });

})(window.angular);

并包含文件：

<script src="components/loader.js"></script>
<link rel="stylesheet" href="components/loader.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/signin.css">
<link rel="stylesheet" href="css/signup.css">
<link rel="stylesheet" href="css/locations.css">

<link rel="stylesheet" href="lib/onsen/css/onsenui.css">
<link rel="stylesheet" href="components/monaca-onsenui/css/onsen-css-components-sunshine-theme.css">
<script src="lib/onsen/js/angular/angular.js"></script>
<script src="lib/onsen/js/onsenui.js"></script>
<script src="js/signctrl.js"></script>

并且在开头调用ons.bootstrap()（在包含js/signctrl.js之前）。

如果您能帮助我并感谢您的帮助，我将非常高兴。

PS：完整的错误是[ng:areq] Argument 'SignCtrl' is not a function, got undefined

PPS：真正的完整错误：

Error: [ng:areq] Argument 'SignCtrl' is not a function, got undefined
http://errors.angularjs.org/1.4.3/ng/areq?p0=SignCtrl&p1=not%20a%20function%2C%20got%20undefined
    at file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1460:4931
    at assertArg (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1460:18360)
    at assertArgFn (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1460:18562)
    at file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1462:20613
    at setupControllers (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1461:27741)
    at nodeLinkFn (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1461:28989)
    at compositeLinkFn (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1461:21271)
    at file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1461:19821
    at pre (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1474:25379)
    at invokeLinkFn (file:///data/data/mobi.monaca.debugger/files/projects/cloud/570c898afd17349b6c3d57a4/www/components/loader.js:1462:13182)

【问题讨论】：

我对温泉不熟悉，但是所有ons-*元素都需要在包含ng-app和ng-controller的元素内吗？
它们是预定义的元素。他们必须（在我的情况下）。感谢您的评论。
这就是我问的原因 - 因为它们并不都在包含 ng-app 和 ng-controller 的元素内。
对不起，误会你了。他们不必这样做。我以为你让我尝试使用普通的 html 元素。
您收到的错误意味着SignCtrl 在尝试使用之前未注册为控制器。发生这种情况是因为在链的上游有另一个错误阻止该代码执行，还是因为在注册它的 javascript 位运行之前尝试访问 SignCtrl 是您必须弄清楚的。除了[ng:areq] 错误之外，控制台中是否还有其他错误？

标签： javascript angularjs twitter-bootstrap onsen-ui monaca

【解决方案1】：

这可能是时间问题。它试图在包含控制器的元素被初始化之前访问控制器。要解决这个问题，请将您的 Angular 代码包装在 ons.ready 函数 (see the docs) 上，一旦完全加载 onsen，它将执行您的代码。

例如：

ons.ready(function() {

  //Your angular code

})

另外，您似乎忘记将温泉模块添加到您的控制器。

希望它能解决您的问题！

【讨论】：