************body中的代码*********************
<body ng-app="myapp">
<a href="#/1">GO pag1.html!
</a>
<a href="#/2">
GO pag2.html!
</a>
<ion-nav-view name="shuju"></ion-nav-view>
</body>
*****************script**************************
<script>
angular.module("myapp", ["ionic"])
.config(function($stateProvider) {
$stateProvider
.state('1', {
url: '/1',
views:{
"shuju":{
templateUrl: 'page1.html'
}
}
})
.state("2",{
url:"/2",
views:{
"shuju":{
templateUrl:"pag2.html"
}
}
})
.state("3",{
url:"/3",
views:{
"shuju":{
templateUrl:"pag3.html"
}
}
})
});
</script>
******************page1.html*********************
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
这是1
</body>
</html>
******************pag2.html*********************
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="lib/css/ionic.min.css" rel="stylesheet" />
<script src="lib/js/ionic.bundle.min.js"></script>
<script src="js/angular.min.js"></script>
<script src="js/jquery-1.11.1.js"></script>
</head>
<body>
<a class="button" href="#/3">跳转</a>
</body>
</html>
******************pag3.html*********************
<html>
<head>
<meta charset="UTF-8">
<title></title>、
<link href="lib/css/ionic.min.css" rel="stylesheet" />
<script src="lib/js/ionic.bundle.min.js"></script>
<script src="js/angular.min.js"></script>
<script src="js/jquery-1.11.1.js"></script>
</head>
<body>
<ion-nav-view>
<ion-content>
<p>
This is page 3.
</p>
<a class="button" ui-sref="1">go to page1</a>
</ion-content>
</ion-nav-view
</body>
</html>