路由:
html
index.html
<ul ng-app="myApp" >
<li><a href="#/">首页</a></li>
<li><a href="#/about">个人中心</a></li>
<li><a href="#/contact">联系我们</a></li>
</ul>
<script src="js/angular.min.js"></script>
<script src="js/angular.route.js"></script>
home.html <div>{{message}}</div>
about.html <div>{{message}}</div>
contact.html <div>{{message}}</div>
script
var myApp=angular.module("myApp",["ngRoute"]);
myApp.config(["$routeProvider",function($routeProvider){
$routeProvider
.when("/",{templateUrl:"home.html",controller:"homeController"})
.when("/about",{templateUrl:"about.html",controller:"aboutController"})
.when("/contact",{templateUrl:"contact.html",controller:"contactController"});
}])
myApp.controller("homeController",function($scope){
$scope.message="home"
}) ;
myApp.controller("aboutController",function($scope){
$scope.message="about";
});
myApp.controller("contactController",function($scope){
$scope.message="contact";
});
html
index.html
<ul ng-app="myApp" >
<li><a href="#/">首页</a></li>
<li><a href="#/about">个人中心</a></li>
<li><a href="#/contact">联系我们</a></li>
</ul>
<script src="js/angular.min.js"></script>
<script src="js/angular.route.js"></script>
home.html <div>{{message}}</div>
about.html <div>{{message}}</div>
contact.html <div>{{message}}</div>
script
var myApp=angular.module("myApp",["ngRoute"]);
myApp.config(["$routeProvider",function($routeProvider){
$routeProvider
.when("/",{templateUrl:"home.html",controller:"homeController"})
.when("/about",{templateUrl:"about.html",controller:"aboutController"})
.when("/contact",{templateUrl:"contact.html",controller:"contactController"});
}])
myApp.controller("homeController",function($scope){
$scope.message="home"
}) ;
myApp.controller("aboutController",function($scope){
$scope.message="about";
});
myApp.controller("contactController",function($scope){
$scope.message="contact";
});