AngularJs路由切换

来源:互联网 发布:上海计算机二级c语言 编辑:程序博客网 时间:2024/06/09 23:11
<!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>
原创粉丝点击