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.
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>
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) {
}
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?
You need to put your templates in index.html itself using script tags so that angular will no longer need to make AJAX requests to fetch them.
<script type="text/ng-template" id="home.html">
This is the content of the template
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With