AngularJS路由而不Web服务器 [英] AngularJS routing without a web server
问题描述
我要开发瘦客户端的HTML5应用程序的SPA。有没有办法来启动它的任何Web服务器。我不能做路由没有作品的网络服务器。
I want to develop html5 SPA application for a thin client. There is no way to launch any web server on it. And I can't to make routing works without web server.
我的index.html
My index.html
<!doctype html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
<script src="app.js"></script>
<title></title>
</head>
<body style="background-color: white;">
<h1>Index</h1>
<a id="link" href="/login">Go to login</a>
<div ng-controller="HomeCtrl">
<ul ng-repeat="number in numbers" >
<li>{{number}}</li>
</ul>
</div>
</body>
</html>
我的app.js
My app.js
angular.module('app', []).
config(function($routeProvider) {
$routeProvider.
when('/', {controller: HomeCtrl, templateUrl: 'index.html'}).
when('/login', {controller: LoginCtrl, templateUrl: 'login.html', resolve: function() {}}).
otherwise({redirectTo:'/'});
});
function HomeCtrl($scope) {
$scope.numbers = [1,2,3,4,5];
}
function LoginCtrl($scope) {
}
我在我的Chrome浏览器在本地计算机上测试此code。数据绑定的工作就像一个魅力，但链接到登录页面是没有的。它导致{X}：\\登录。所以，我的问题是：是否有可能使它的工作原理与出Web服务器？其次把它做什么，我缺少什么？
I'm testing this code locally on my computer in Chrome. Data binding is working like a charm, but link to the login page isn't. It's leading to the {X}:\login. So my questions are: is it possible to make it works with out web server? And secondly what I'm missing to get it done?
推荐答案
一段时间后，我做了它的工作原理。
After a while, I made it works.
起初，我搬到这片成单独的文件
At first, I moved this piece into separate file
<div ng-controller="HomeCtrl">
<ul ng-repeat="number in numbers" >
<li>{{number}}</li>
</ul>
</div>
其次，在 index.html的我已经添加了这个div
Secondly, in index.html I've added this div
<div ng-view></div>
它是用来作为一个视图占位符。
It is used as a view placeholder.
现在 index.html的作为母版页或布局，如果你熟悉asp.net。当你在点击链接时，templateUrl文件的内容插入到占位符DIV。
Now index.html is used as "master page" or "layout" if you are familiar with asp.net. When you clicking at the link, content of the templateUrl file is inserting into placeholder div.
这样做的缺点是URL应该看起来像这样＆LT; A HREF =＃/登录＆GT;＆LT; / A＆GT;
A drawback of this is that url should looks like this <a href="#/login"></a>
这篇关于AngularJS路由而不Web服务器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
