AngularJS表单双向绑定

时间:2013-12-30 16:49:04

标签: javascript angularjs

我是angularJS的新手

我尝试使用angularJS

创建注册表单

但是当我按提交时它不起作用。

ng-disable属性正在运行

HTML

<div class="col-xs-8 col-sm-8 col-md-8 col-lg-8 well" ng-contoller="EditUserController">
      <form name="registerUser" class="form">
        <legend>Register</legend>
        <div class="form-group">
          <label for="inputFirstname">First Name :</label>
          <input type="text" name="firstname" id="inputFirstname" class="form-control" value="" required  title="" placeholder="First Name" ng-model="user.firstname">
        </div>
        <div class="form-group">
          <label for="inputLastName">Last Name :</label>
          <input type="text" name="lastname" id="inputLastName" class="form-control" value="" required title="" placeholder="Last Name" ng-model="user.lastname">
        </div>
        <div class="form-group">
          <label for="inputUsername">UserName :</label>
          <input type="text" name="username" id="inputUsername" class="form-control" value="" required  title="" placeholder="Username" ng-model="user.username">
        </div>
        <div class="form-group">
          <label for="inputEmail">Email :</label>
          <input type="email" name="email" id="inputEmail" class="form-control" value="" required title="" placeholder="your email" ng-model="user.email">
        </div>
        <button class="btn btn-primary" ng-disabled="registerUser.$invalid" ng-click="saveuser(user,registerUser)" >Submit</button>
      </form>       
</div>

EditUserController.js

motobike.controller('EditUserController',
function EditUserController($scope){
    $scope.saveuser = function(user, register){
        console.log(register);
        if (register.$valid) {
          window.alert('suceess');
        }   
    }
}   
);

app.js

'use strict';
var motobike = angular.module('motobike', ['ngSanitize']);

2 个答案:

答案 0 :(得分:2)

ng-contoller更改为ng-controller ^^

答案 1 :(得分:2)

class="col-xs-8 col-sm-8 col-md-8 col-lg-8 well" ng-contoller="EditUserController"

应该是

class="col-xs-8 col-sm-8 col-md-8 col-lg-8 well" ng-controller="EditUserController"

^^