I want to create an app using AngularJS that is contained in one file. Something similar to jQuery Mobile's multi-page template. It would be nice to define several divs with ng-controller, each of which would represent a controller with a template. Instead, angular-ui-router seems to require a templateUrl or a template string. Is there an elegant way to do that?
Add a comment
|
1 Answer
Sure , you can put your templates into script tag directives like this:
<script type="text/ng-template" id="page1.html">
<h1>Page 1</h1> <b>markup</b>
</script>
<script type="text/ng-template" id="page2.html">
<h2>Page 2</h2> here we go
</script>
And then customize the routeProvider in this way:
$routeProvider.when('/page1', {
templateUrl : "page1.html"
}).when('/page2', {
templateUrl : "page2.html"
}).otherwise({
redirectTo: 'page1'
});
