我有一個形式,從用戶那裏收集註冊信息,這樣定義:AngularJS表單提交
<form class="m-t-xl" ng-submit="signup(user)" novalidate>
<div class="form-group">
<input type="text" class="form-control" placeholder="Name" required="" ng-model="user.name">
</div>
<div class="form-group">
<input type="email" class="form-control" placeholder="Email" required="" ng-model="user.email">
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Company" required="" ng-model="user.company">
</div>
<div class="form-group">
<input type="password" class="form-control" placeholder="Password" required="" ng-model="user.password">
</div>
<div class="form-group">
<div class="checkbox i-checks"><label> <input type="checkbox"><i></i> Agree the terms and policy </label></div>
</div>
<button type="submit" class="btn btn-primary block full-width m-b">Register</button>
<p class="text-muted text-center"><small>Already have an account?</small></p>
<a ui-sref="login" class="btn btn-sm btn-white btn-block">Login</a>
</form>
出於某種原因,當我點擊提交按鈕,沒有任何反應。該按鈕已經死了。 我的控制器有下面的代碼:
.controller('registerCtrl', ['$scope', '$state', 'Registration',
function($state, $scope, Registration) {
$scope.user = {
name: '',
email: '',
company: '',
password: ''
};
console.log('controller getting loaded');
$scope.signup = function(user) {
console.log('register getting called');
}
}]);
它充當如果窗體不承認「註冊」的方法。以類似的方式,我實現了一個登錄表單:
<form class="m-t" ng-submit="login(credentials)" novalidate>
<div class="form-group">
<input type="email" class="form-control" placeholder="Email" required="" ng-model="credentials.email">
</div>
<div class="form-group">
<input type="password" class="form-control" placeholder="Password" required="" ng-model="credentials.password">
</div>
<button type="submit" class="btn btn-primary block full-width m-b">Login</button>
<a ui-sref="forgot_password"><small>Forgot password?</small></a>
<p class="text-muted text-center"><small>Do not have an account?</small></p>
<a class="btn btn-sm btn-white btn-block" ui-sref="register">Create an account</a>
</form>
和:
.controller('loginCtrl', ['$scope', '$rootScope', '$state', 'Authentication', 'AUTH_EVENTS',
function($scope, $rootScope, $state, Authentication, AUTH_EVENTS) {
$scope.credentials = {
email: '',
password: ''
};
$scope.login = function(credentials) {
Authentication.login(credentials).then(function(user) {
$rootScope.$broadcast(AUTH_EVENTS.loginSuccess);
$scope.setCurrentUser(user);
$state.go('events');
}, function() {
$rootScope.$broadcast(AUTH_EVENTS.loginFailed);
});
}
}]);
第二種形式是工作正如預期......我在茫然,到底是怎麼回事。我想說,我登錄了registerCtrl,它正在被正確加載到頁面中,但該方法在被調用時不會執行任何操作。
任何想法還有什麼可能導致此?我檢查了所有的解決方案,但沒有任何幫助。
在我的config.js,這兩條路徑都同樣宣稱:「註冊」按鈕調用同一方法
.state('login', {
url: "/login",
templateUrl: "views/login.html",
data: { pageTitle: 'Login', specialClass: 'gray-bg' }
})
.state('register', {
url: "/register",
templateUrl: "views/register.html",
data: { pageTitle: 'Register', specialClass: 'gray-bg' }
})
我也試圖改變我的形式有NG點擊,但是這有同樣的行爲。
謝謝!
您是否檢查了控制檯的錯誤?你確定正確的'$ scope'用於註冊表單嗎? – puelo
沒有錯誤。我還檢查了「用戶」是否在範圍內,並且添加{{user}}作爲調試文本顯示正確的文本,因爲我填寫了表單。所以「用戶」變量同步得很好。 –