Question

我正在学习如何使用AngularJS，但我无法使用自定义ng-click功能。我想要做的是触发包含来自我的表单（$http.post，$scope.email，$scope.username）的数据的$scope.password请求。到目前为止，我只尝试传递电子邮件，但是当我点击提交按钮时没有任何反应（没有发出POST请求，我用firebug检查这个）。我尝试将其直接传递为$scope.email，或作为变量传递（如下所示）。

我有一个主页面（index.html），使用ng-view使用ngRoute加载html。这是路线代码：

.when('/register', {
        templateUrl: 'views/register.html',
        controller: 'RegisterCtrl'
      })

这是我的register.html：

<div class="container">
    <div class="col-xs-2 col-sm-3 col-md-4"></div>
    <div class="col-xs-8 col-sm-6 col-md-4">
        <h1>Sign Up:</h1>
        <form>
            <div class="form-group">
                <label for="email">Email address:</label>
                <input type="email" class="form-control" id="email" ng-model="email">
            </div>
            <div class="form-group">
                <label for="username">Username:</label>
                <input type="text" class="form-control" id="username" ng-model="username">
            </div>
            <div class="form-group">
                <label for="pwd">Password:</label>
                <input type="password" class="form-control" id="pwd" ng-model="password">
            </div>
            <button type="submit" class="btn btn-primary col-xs-5" ng-click="register">Sign up</button>
            <div class="col-xs-2"></div>
            <button class="btn btn-info col-xs-5">Go to log in</button>
        </form>
    </div>
</div>

和我的控制员：

'use strict';

angular.module('angularApp')
  .controller('RegisterCtrl', function ($scope, $http) {
        $scope.email = '';
        $scope.username = '';
        $scope.password = '';

        $scope.register = function() {
            // TODO ADD VALIDATION
            var email = $scope.email;
            var username = $scope.username;
            var password = $scope.password;

            // $http request
            $http.post('http://localhost/PTC/API/new_user.php', email).
                success(function(data) {
                    console.log(data);
                }).
                error(function(data) {
                    console.log(data);
                });
        };
  });

Answer 1

它应该有函数()括号来调用ng-click="register()"

之类的函数

要获得更好的方式，而不是在表单上使用ng-click，可以将其替换为ng-submit指令

<强>标记

    <form name="myForm" ng-click="register()">
        ...fields here..
        <button type="submit" class="btn btn-primary col-xs-5">Sign up</button>
        <div class="col-xs-2"></div>
        <button class="btn btn-info col-xs-5">Go to log in</button>
    </form>

此外，您需要为表单指定表单名称，以便在表单验证方面获得更好的控制权。

ng-click无法处理提交按钮

1 个答案: