AngularJS中Route例子

時間 2019-11-08

原文原文鏈接

代碼：https://files.cnblogs.com/files/xiandedanteng/angularJSRouteSample.rarhtml

點擊‘首頁’後：app

點擊‘電腦’後：ide

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta charset="utf-8">
        <title>AngularJS 路由實例 - 菜鳥教程</title>
    </head>
    <body ng-app='routingDemoApp'>
     
        <h2>AngularJS 路由應用</h2>
        <ul>
            <li><a href="#/">首頁</a></li>
            <li><a href="#/computers">電腦</a></li>
            <li><a href="#/printers">打印機</a></li>
            <li><a href="#/blabla">其餘</a></li>
        </ul>
         
        <div ng-view></div>
    </body>
</html>

<script src="angular1.4.6.min.js"></script>
<script src="angular-route_1.3.13.js"></script>
<script>
    angular.module('routingDemoApp',['ngRoute'])
    .config(['$routeProvider', function($routeProvider){
        $routeProvider
        .when('/',{template:'這是首頁頁面'})
        .when('/computers',{template:'這是電腦頁面'})
        .when('/printers',{template:'這是打印機頁面'})
        .otherwise({redirectTo:'/'});
    }]);
</script>

相關標籤/搜索