angularjs ngRoute不工作 [英] angularjs ngRoute not working
问题描述
ngRoute而没有报告错误，来安慰无法正常工作。
ngRoute not working while no errors are reported to console .
没有给出错误安慰，怎么可能遵循ngRoute程序执行？
given no errors to console, how is it possible to follow execution of ngRoute procedures ?
我看到了使用$ locationProvider.html5Mode（真）时，应使用我不明白的例子，但它需要做的工作ngRoute我不认为。
i saw examples using $locationProvider.html5Mode(true), i don't understand when that should be used but i don't think it is required to make ngRoute work.
index.html的具有导航链接和ngView：
index.html has navigation links and ngView :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="bower_components/angular/angular.js"> </script>
<script src="bower_components/angular-route/angular-route.js"> </script>
<script src="main.js"> </script>
</head>
<body ng-app="Main">
<ul>
<li> <a href="#content/first"> first partial </a> </li>
<li> <a href="#content/second"> second partial </a> </li>
</ul>
<div ng-view></div>
</body>
</html>
main.js定义路由器和控制器：
main.js defines the router and the controllers :
var Main = angular.module('Main', ['ngRoute']);
function router($routeProvider) {
var route = {templateUrl: 'partials/default.html'};
$routeProvider.when('', route);
route = {
templateUrl: 'partials/first.html',
controller: 'first'
};
$routeProvider.when('content/first', route);
route = {
templateUrl: 'partials/second.html',
controller: 'second'
};
$routeProvider.when('content/second', route);
}
Main.config(['$routeProvider', router]);
Main.controller('first', function($scope) {
$scope.list = [1,2,3,4,5];
});
Main.controller('second', function($scope) {
$scope.list = [1,2,3];
});
谐音只是利用ngRepeat的：
partials simply make use of ngRepeat:
<header> First content </header>
<p ng-repeat="iter in list">
first
</p>
解决：
我的问题是，我的整个应用程序位于/ ANG / preFIX，并补充说，preFIX到URL后，现在它正在发挥作用。
不应该有使用相对URL的方式？我想应该有，我会尝试修复它。
solved : my problem was that my whole application is located under /ang/ prefix, and after adding that prefix to urls now it is working . shouldn't there be a way to use relative urls ? i guess there should and i will try to fix it .
问题是不是因为每个人提出的不同的语法，这是令人震惊的事实，许多开发商JS不事实上明白，他们正在使用无处不在一行语法。
the problem is NOT with the different syntax as everyone suggested, and that is alarming to the fact many JS developer do not in fact understand the one line syntax that they are using everywhere .
推荐答案
请检查该code
HTML code
Please check this code HTML code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular-route.js"> </script>
<script src="script.js"> </script>
</head>
<body ng-app="Main">
<ul>
<li> <a href="#/content/first"> first partial </a> </li>
<li> <a href="#/content/second"> second partial </a> </li>
</ul>
<div ng-view></div>
</body>
</html>
JS文件
var app = angular.module('Main', ['ngRoute']);
app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider.
when('/content/first', {
templateUrl: 'first.html',
controller: 'first'
}).
when('/content/second', {
templateUrl: 'second.html',
controller: 'second'
});
}]);
app.controller('first', function($scope) {
$scope.list = [1,2,3,4,5];
});
app.controller('second', function($scope) {
$scope.list = [1,2,3];
});
第一页HTML
first page HTML
<header> First content </header>
<p ng-repeat="item in list">
{{item}}
</p>
这是你的工作code 点击
这篇关于angularjs ngRoute不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
