[英]ng-view and Angular functions are not working in FireFox
I have created the sample application to get familiar with AngularJS. 我创建了示例应用程序来熟悉AngularJS。 i have tried to test my application functionality in Google Chrome and it is working perfectly, then tried to execute the same functionality in FireFox but the ng-view and other functions are not working. 我曾尝试在Google Chrome浏览器中测试我的应用程序功能,并且工作正常,然后尝试在FireFox中执行相同的功能,但是ng-view和其他功能无法正常工作。
I have structured my application like following, 我的应用程序结构如下:
Index.html Index.html
<!DOCTYPE html>
<html ng-app="userManagement">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>User Management</title>
<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="css/angular.css">
<style type="text/css">
body {
margin-top: 50px;
}
</style>
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
<span class="glyphicon glyphicon-tasks"></span>
</button>
<a class="navbar-brand" href="#">User Managment</a>
<ul class="nav navbar-nav pull-right"
ng-controller="RouterController as route">
<li ng-class="{active:route.isTab(1)}" ng-hide="route.isLoggedIn"><a
href="#/login" ng-click="route.setTab(1)">Login</a></li>
<li ng-class="{active:route.isTab(2)}" ng-hide="route.isLoggedIn"><a
href="#/signup" ng-click="route.setTab(2)">Sign Up</a></li>
<li ng-class="{active:route.isTab(3)}" ng-show="route.isLoggedIn"><a
href="#/signup" ng-click="route.setTab(3)">DashBoard</a></li>
</ul>
</div>
</div>
</div>
<div ng-view=""></div>
<script type="text/javascript" src="lib/angular/js/angular.min.js"></script>
<script type="text/javascript"
src="lib/angular/js/angular-route.min.js"></script>
<script type="text/javascript" src="lib/jquery/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="app/main.js"></script>
<script type="text/javascript" src="app/controllers/loginController.js"></script>
<script type="text/javascript"
src="app/controllers/signUpController.js"></script>
<script type="text/javascript" src="app/services/httpService.js"></script>
<script type="text/javascript"
src="app/controllers/dashBoardController.js"></script>
<script type="text/javascript"
src="app/controllers/routerController.js"></script>
</body>
</html>
main.js main.js
(function() {
var app = angular.module("userManagement", [ 'ngRoute' ]);
app.config(function($routeProvider) {
$routeProvider.when('/login', {
controller : 'LoginController',
templateUrl : 'app/views/login.html'
}).when('/signup', {
controller : 'SignUpController',
templateUrl : 'app/views/signup.html'
}).otherwise({
redirectTo : '/login'
});
});
})();
it has the route configuration for the application. 它具有应用程序的路由配置。
login.html login.html
<div class="container" ng-controller="LoginController as login">
<h1>User Login</h1>
<div class="alert alert-warning" ng-show="login.isError()">{{errorMessage}}</div>
<form name="loginForm" class="form-horizontal" role="form"
ng-submit="loginForm.$valid && login.doLogin()" novalidate>
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">Email</label>
<div class="col-sm-6">
<input type="email" class="form-control" placeholder="Email Address"
name="email" autofocus="autofocus" ng-model="login.user.userName"
required ng-pattern="/^\w+@\w+\.\w{2,3}$/"> <span
ng-show="loginForm.email.$error.pattern"> Invalid Email
Address!</span></input>
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password
</label>
<div class="col-sm-6">
<input type="password" class="form-control" placeholder="Password"
name="pass" ng-model="login.user.password" required
ng-minlength="6" ng-maxlength="10" maxlength="10"><span
ng-show="loginForm.pass.$error.minlength || loginForm.pass.$error.maxlength">
The input characters must be in range 6 to 10!</span></input>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-2">
<button type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2">
<label class="col-sm-2" style="width: 60%;"><span id="fpass">Forgot
your password?</span></label>
</div>
</div>
</form>
</div>
LoginController LoginController
(function() {
var app = angular.module('userManagement');
app.controller('LoginController',['$scope','$log','$http',function($scope, $log, $http) {
var self = this;
self.user = {};
self.doLogin = function() {
$log.log("Login UserName: "
+ self.user.userName);
$log.log("Login Password: "
+ self.user.password);
$log.log(JSON.stringify(self.user));
$http({
url : "http://localhost:8080/UserManagementREST/service/user/login",
data : self.user,
method : "POST",
transformRequest : function(
data) {
$log
.log("Transforming request");
if (data === undefined) {
return data;
}
return $.param(data);
},
headers : {
"Content-Type" : "application/x-www-form-urlencoded; charset=utf-8"
}
}).success(function(data) {
$log.log(JSON.stringify(data));
}).error(function(data) {
$log.log(JSON.stringify(data))
});
};
} ]);
})();
these are the sample code of my application. 这些是我的应用程序的示例代码。 this is working perfectly in Chrome but not in Firefox please help me to resolve this. 这在Chrome浏览器中运行正常,但在Firefox中无法正常运行,请帮助我解决此问题。
Screen shots: 屏幕截图:
Chrome Screen 镀铬屏幕
FireFox Screen FireFox屏幕
It's working for me once i reset my firefox. 一旦我重置了Firefox,它对我来说就是工作。 Some plugin was prevented the normal web execution flow. 某些插件被阻止了正常的Web执行流程。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.