Angularjs路线在这里不起作用
[英]Angularjs routes not working here
问题描述
我已经用一切可能的方法来解决这个问题，但失败了。 如果您有任何疑问可以了解此问题，请告知我们。 下面是我的代码，检查是否有语法错误。 我已经使用本地角度js文件进行路由并尝试使用cdn。 但没有任何影响。
的index.html
<!-- define angular controller -->
<body ng-app="mydemo" ng-controller="mainController">
<ul>
<li><a href="#"> Home</a></li>
<li><a href="#about"></i> About</a></li>
<li><a href="#contact"></i> Contact</a></li>
</ul>
<div ng-view></div>
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script src="script.js"></script>
的script.js
我使用了1.5.7的angularjs版本
var mydemo = angular.module('mydemo', ['ngRoute']);
mydemo.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl : 'pages/home.html',
controller : 'mainController'
})
// route for the about page
.when('/about', {
templateUrl : 'pages/about.html',
controller : 'aboutController'
})
// route for the contact page
.when('/contact', {
templateUrl : 'pages/contact.html',
controller : 'contactController'
});
});
mydemo.controller('mainController', function($scope) {
$scope.message = 'Everyone come and see how good I look!';
});
mydemo.controller('aboutController', function($scope) {
$scope.message = 'Look! I am an about page.';
});
mydemo.controller('contactController', function($scope) {
$scope.message = 'Contact us! JK. This is just a demo.';
});
4 个解决方案
解决方案1
0 2016-07-15 14:06:15
代替
<li><a href="#contact"></i> Contact</a></li>
怎么样的尝试
<li><a ng-href="#/contact"></i> Contact</a></li>
我认为路线必须完全匹配，其中包括/ 。
解决方案2
0 2016-07-15 14:06:30
试试这个script.js文件：
angular.module('mydemo', ['ngRoute']).config(function($routeProvider) {
$routeProvider.
.when('/', {
templateUrl : 'pages/home.html',
controller : 'mainController'
})
// route for the about page
.when('/about', {
templateUrl : 'pages/about.html',
controller : 'aboutController'
})
// route for the contact page
.when('/contact', {
templateUrl : 'pages/contact.html',
controller : 'contactController'
});
});
mydemo.controller('mainController', function($scope) {
$scope.message = 'Everyone come and see how good I look!';
});
mydemo.controller('aboutController', function($scope) {
$scope.message = 'Look! I am an about page.';
});
mydemo.controller('contactController', function($scope) {
$scope.message = 'Contact us! JK. This is just a demo.';
});
和index.html：
<head>
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script src="script.js"></script>
</head>
<!-- define angular controller -->
<body ng-app="mydemo" ng-controller="mainController">
<ul>
<li><a href="#"> Home</a></li>
<li><a href="#about"></i> About</a></li>
<li><a href="#contact"></i> Contact</a></li>
</ul>
<div ng-view></div>
</body>
解决方案3
0 2016-07-15 14:30:29
检查下面的修复：
$routeProvider // there are two dots in your code here, just remove one and it will fix the issue
.when('/', {
templateUrl : 'pages/home.html',
controller : 'mainController'
})
解决方案4
0 2016-07-15 14:41:29
您使用的角度版本很可能与角度路径的版本不匹配。 确保版本兼容。
angularJS 路由（没有错误）不起作用
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.