在我的angularjs应用程序中,我在公共文件夹中有index.html,其代码如下,
<body ng-controller="TheController">
<div id="startdiv">
<label>Username</label><input type="text" tabindex="1" placeholder="Enter Your User Name" name="email" required>
<label>Password</label><input type="password" tabindex="2" placeholder="Enter Your Password" name="password" required>
<br><br>
<button ng-click="saveData()">Login</button><button ng-click="saveData()">SignUp</button><br>
<button ng-click="changeview()">ClickMe</button>
</div>
</body>
脚本部分如下,
var app = angular.module('plunker',['ngRoute']);
app.config(['$locationProvider', function($locationProvider) {
$locationProvider.hashPrefix('');
}]);
app.config(function($routeProvider) {
$routeProvider
.when("/test", {
templateUrl : "index.html"
})
.when("/london", {
templateUrl : "london.html",
});/*
.otherwise({
redirectTo: '/paris.html'
}); */
});
app.controller('TheController', function ($scope,$location) {
console.log('hello')
$scope.changeview = function () {
console.log('in functgion changeview')
console.log($location)
$location.path('/london');
}
});
此外,我在相同的公共文件夹中有london.html,我想在按钮点击时加载。
my london.html
<h1>London</h1>
<h3>London is the capital city of England.</h3>
问题是,点击按钮后,网址将从&#34; http://localhost:3000/&#34;更改到&#34; http://localhost:3000/#/london&#34;但是html页面没有加载。另外我想知道是否可以使用哈希字符进行路由。
请让我知道我在哪里弄错了。 感谢。
答案 0 :(得分:0)
在app.module.js
$ locationProvider.html5Mode(真);
示例:强>
window.routes = {
'/': {
templateUrl: 'app/visitor/visitor.html',
anonymous: true
},
'/index': {
templateUrl: 'app/visitor/visitor.html',
caseInsensitiveMatch: true,
anonymous: true
},
'/lu/:mt?/:tab?/:id?': {
templateUrl: 'app/user/user.html',
caseInsensitiveMatch: true,
anonymous: false
}
};
app.config(function ($routeProvider, $locationProvider) {
for (var path in window.routes) {
$routeProvider.when(path, window.routes[path]);
}
$routeProvider.otherwise({redirectTo: '/'});
$locationProvider.html5Mode(true);
});
同样作为示例中的templateUrl: 'app/visitor/visitor.html',
,设置文件的完整路径。