AngularJS dindn't work in firefox - angularjs

Question

I wrote a login for a web-application. In chrome the login works but not in firefox.
<form ng-submit="$ctrl.login()">
<div class="cClearFloat">
<input type="text" name="Benutzername" placeholder="Benutzername" ng-model="$ctrl.userName">
</div>
<div class="cClearFloat">
<input type="password" name="Passwort" placeholder="Passwort" ng-model="$ctrl.password">
</div>
<div class="cClearFloat">
<div class="cButtonLogin" class="button">
<button class="cLinkLogin" type="submit">Anmelden</button>
</div>
</div>
</form>
login call:
login() {
this.userService.login(this.userName, this.password);
}
login:
login(userName, password) {
this.$http.post("http://localhost:20670/login", { UserName: userName, Password: password }).then((response) => {
this.userInfo = this.hateoasService.fromData(response.data);
this.$http.defaults.headers.common.LoginToken = this.userInfo.LoginToken;
this.isLoggedIn = true;
}, (response) => {
swal({
title: response.data.error,
type: 'error'
})
});
}
All what happens when I test it in firefox is that it reloads the page. Does someone know why it's not working? Is it possible that it makes the reload is because angularjs isn't available and he takes the default from ng-submit?
in my console I had this error

Answer 1

Use ng-submit on your form and change the button type to submit
On your view:
<div ng-app="myApp" ng-controller="myCtrl">
<form ng-submit="login()">
<input type="text" name="Benutzername" placeholder="Benutzername" ng-model="model.userName">
<input type="password" name="Passwort" placeholder="Passwort" ng-model="model.password">
<button class="cLinkLogin" type="submit">Anmelden</button>
</form>
</div>
On controller :
var app = angular.module("myApp", []);
app.controller("myCtrl", myCtrl);
function myCtrl($scope) {
$scope.model = {};
$scope.login = function() {
alert("username: " + $scope.model.userName + ", password: " + $scope.model.password);
}
}
See http://codepen.io/anon/pen/dNgvJp?editors=1010