Ng-Click没有开火

Question

每当我点击我的提交按钮时没有任何反应，目前我想要它做的是打印出用户名和密码来测试绑定。 我能够与控制器通信并打印出我在控制器中创建的硬编码消息，似乎ng-click不会触发该方法。 任何帮助都会很棒，谢谢：D

<section id="register-view" class="mainbar">
    <section class="matter">
        <div class="container">
            <div class="row">
                <label>{{vm.message}}</label>
                <form class="register-form">
                    <label name="username_label"> Username: </label>
                    <input type="text" name="username" ng-model="vm.userDetails.username"/>
                    <br/>
                    <label name="password_label"> Password: </label>
                    <input type="text" name="password" ng-model="vm.userDetails.password"/>
                    <br/>
                    <button type="submit" class="btn btn-default" ng-click="vm.submitUserDetails()">Submit</button>
                </form>

            </div>
        </div>
    </section>
</section>

和控制器类

(function () {
    'use strict';

    angular
        .module('app.register')
        .controller('RegisterController', RegisterController);

    RegisterController.$inject = ['$q', 'dataservice', 'logger'];
    /* @ngInject */
    function RegisterController($q, dataservice, logger) {
        var vm = this;
        vm.message = 'baass';
        vm.userDetails = {
            username: '',
            password: ''
        }

        function activate() {
            var promises = [submitUserDetails()];
            return $q.all(promises).then(function () {
                logger.info('Activated Dashboard View');
            });
        }

        function submitUserDetails() {
            console.log('Username: ' + vm.userDetails.username);
            console.log('Password: ' + vm.userDetails.password);
        }
    }
})();

Answer 1

您需要在控制器上下文中添加submitUserDetails以使其在视图中可用，因为您只定义了submitUserDetails的功能。 您应该将其引用绑定到vm.submitUserDetails

vm.submitUserDetails = submitUserDetails;

Answer 2

该函数需要附加到$ scope

$scope.function submitUserDetails() {
        console.log('Username: ' + vm.userDetails.username);
        console.log('Password: ' + vm.userDetails.password);
    }

Answer 3

你的代码似乎有一些问题，但最大的问题是那些函数实际上并没有附加到'this'（你在代码中称之为vm ）。 因此，范围无法访问它们，因为它们只能在RegisterController函数内访问。

要解决这个问题，我会将此代码添加到函数的底部：

this.activate = activate;
this.submitUserDetails = submitUserDetails;

同样， submitUserDetails()应该返回一个promise，不是吗？ 我希望这也会导致一些时髦的行为。