ng路由工作不正常
ngRoute not working properly
ngRoute以前工作正常,现在停止工作,因为添加了一些文件和控制器。在浏览器中,我得到的URL为http://localhost/#browsefp而不是http://localhost/#/browsefp
下面是我的代码,请帮忙。学习AngularJS,不断遇到奇怪的问题。在JS控制台中没有看到错误。
app.js
var app = angular.module('DevStreamApp', ['ngRoute']);
app.config(function($routeProvider){
$routeProvider
.when('/', {templateUrl : 'views/main.html', controller : 'mainController' })
.when('/addnew', {templateUrl : 'views/addnew.html', controller : 'homeController', css : 'css/screen.css'})
.when('/addnewfp', {templateUrl : 'views/addnewfeeprogram.html', controller : 'homeController', css : 'css/screen.css'})
.when('/addnewcm', {templateUrl : 'views/addnewcustomermapping.html', controller : 'aboutController', css : 'css/screen.css'})
.when('/browsefp', {templateUrl : 'views/browseprogram.html', controller : 'browseprogramController', css : 'css/screen.css'})
.otherwise({ redirectTo : '/' })
});
index.html
<!doctype html>
<!-- define angular app -->
<html ng-app="DevStreamApp">
<head>
<titleFee </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css" media="screen">
@import url("/css/screen.css");
@import url("/js/yui/container.css");
</style>
<!-- load angular and angular route via CDN -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"> </script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
<script src="js/app.js"></script>
</head>
<body>
<hr noshade/>
<!-- MAIN CONTENT AND INJECTED VIEWS -->
<div id="main">
<!-- angular templating -->
<!-- this is where content will be injected -->
<a href="#addnew">Add new </a><br/>
<a href="#addnewfp">Add new Fee Program</a><br/>
<a href="#addnewcm">Add new Customer mapping</a><br/>
<a href="#browsefp">Browse Fee Program</a>
<div ng-view></div>
</div>
</body>
<script src="js/app.js"></script>
<script src="js/controllers/mainController.js"></script>
<script src="js/controllers/homeController.js"></script>
<script src="js/controllers/aboutController.js"></script>
<script src="js/controllers/contactController.js"></script>
<script src="js/controllers/browseprogramController.js"></script>
</html>
mainController.js
//create the controller module
angular.module('DevStreamApp').controller('mainController', function($scope) {
// create a message to display in our view
$scope.message = 'Everyone come in Main Controller!';
});
从href中删除#,正如您在文档中看到的那样,他们将其配置如下:
<a href="Book/Moby">Moby</a>
.when('/Book/:bookId', {
....
});
所以在你的情况下,它会是:
<a href="addnew">Add new </a><br/>
<a href="addnewfp">Add new Fee Program</a><br/>
<a href="addnewcm">Add new Customer mapping</a><br/>
<a href="browsefp">Browse Fee Program</a>
默认情况下,AngularJS将使用hashtag路由URL,但您可以使用$locationProvider删除它。
您将使用$locationProvider模块并将html5Mode设置为true。
var app = angular.module('DevStreamApp', ['ngRoute']);
app.config(function($routeProvider, $locationProvider){
$locationProvider.html5Mode(true);
... your code ...
在你的index.html中,链接必须是
<a href="addnew">Add new </a><br/>
相关文章:
- Javascript.getHours()工作不正常
- 为什么不是't窗口.恢复正常工作吗?(javascript/jquery)
- 谷歌分析跟踪内部链接不正常工作的事件
- 电话间隙 2.8 位置:固定不正常工作
- GMT . sehours不正常工作
- Jquery幻灯片效果不正常工作
- D3拖动不正常工作
- Jquery搜索字符串从跨度不正常工作
- 美元的范围.在使用MongoDB的controller.js中编辑不正常工作
- 随机音乐播放通过HTML javascript不正常工作
- 华丽的jQuery图像库插件不正常工作,只有在网站的一部分
- Javascript按钮在时钟当前计时不正常工作
- 导航器显示Internet连接状态.联机不正常工作,并显示错误的状态,而互联网没有连接
- jQuery切换不正常工作的第二次
- 谷歌API自动完成不正常工作
- 触摸结束事件不正常工作在铬
- 如何修复HTML5视频Javascript跟踪代码不正常工作
- 为什么第二次按钮点击不正常工作
- 美元.ajax不正常工作在我的代码
- 切换显示的潜水在道场不正常工作在谷歌Chrome浏览器