繁体   English   中英

为什么我的角度控制器功能不被调用?

[英]Why doesn't my angular controller function get called?

泽HTML:

<body ng-app="ReporterApplication" ng-controller="BootstrapController as bootstrap">
        <div><% boostrap.user %></div>
        <div id="pagePreloader"></div>

        <div ng-if="!bootstrap.user.logged" ng-controller="LoginController as login" class='site-wrapper-login'>

            <form role="form" name="login" class="form-login">

                <div class="logo-wrapper">
                    <img class="logo" src="/resources/images/logo.png">
                    <div class="logo-text">
                        <div class="reporter">Reporter</div>

                        <div class="application">Internal Application</div>
                    </div>

                </div>

                <div class="icon-input large">
                    <i class="icon  fa fa-user"></i>
                    <input ng-model="login.username" type="text" name="reg_username" class="input-text" id="username" placeholder="Enter Username">
                </div>

                <div class="icon-input large">
                    <i class="icon fa fa-lock"></i>
                    <input ng-model="login.password" type="password" name="reg_password" class="input-text" id="password" placeholder="Enter Password">
                </div>

                <button class="button full large" ng-click="login.submit()">Login</button>

            </form>

        </div>

并且回顾JS:

Application.controller('LoginController', ['$scope', 'ServerActions', function($scope, ServerActions)
{
    console.log('WE LOGIN!');
    var login = this;

    login.username = "";
    login.password = "";

    login.submit = function () {
        console.log('SUBMIT');
        ServerActions.fetchData('login.action', {username: login.username, password: login.password}).then(
            function (response) {
                console.log('SUBMIT SUCCESS');
            }
        );
    }
}]);

由于某种原因,我的提交函数没有被调用。 这是为什么? 我究竟做错了什么? 为什么上帝恨我!?!??! 控制器堆叠有什么干扰我期望代码工作的方式吗?

<form name=login>这实际上是从表单元素创建一个全局变量name ,因此它与您给控制器的名称冲突。 从表单中删除名称:

<div ng-controller="LoginController as login" class='site-wrapper-login'>
    <form role="form" class="form-login">
    </form>
</div>

或者将控制器重命名为变量:

<div ng-controller="LoginController as loginCtrl">

示例小提琴

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM