<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="jss/angular1.4.6.min.js"></script> <script src="jss/angular-route.min.js"></script> </head> <body ng-app="myApp"> <script type="text/ng-template" id="home.html"> <h1>home</h1> <h1>home</h1> </script> <script type="text/ng-template" id="sendUs.html"> <h1>sendUs</h1> <h1>sendUs</h1> </script> <script type="text/ng-template" id="aboutUs.html"> <h1>aboutUs</h1> <h1>aboutUs</h1> </script> <div> <ul style="..."> <li><a href="#/">首页</a></li> <li><a href="#/guanyu">首页1</a></li> <li><a href="#/sendUs">首页2</a></li> <li><a href="#/sendUs111">首页3</a></li> </ul> </div> <div style="..."> <div ng-view></div> </div> <script> var myApp = angular.module("myApp",["ngRoute"]); myApp.config(function ($routeProvider) { $routeProvider.when("/",{ templateUrl:"home.html" }).when("/guanyu",{ templateUrl:"sendUs.html" }).when("/sendUs",{ templateUrl:"aboutUs.html" }).otherwise("/",{ templateUrl:"home.html" }); }); </script> </body> </html>
AngularJs路由切换
最新推荐文章于 2018-11-27 09:44:55 发布