HTML 路由换div

来源：互联网发布：华为机顶盒软件下载编辑：程序博客网时间：2024/06/02 05:36

<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>        <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>        <script src="http://apps.bdimg.com/libs/angular-route/1.3.13/angular-route.js"></script>        <script>            angular.module('routingDemoApp',['ngRoute'])            .config(['$routeProvider', function($routeProvider){                $routeProvider                .when('/',{template:'这是首页页面'})                .when('/computers',{template:'这是电脑分类页面'})                .when('/printers',{template:'这是打印机页面'})                .otherwise({redirectTo:'/'});            }]);        </script>              </body></html>

$routeProvider.when('/computers', {    templateUrl: 'views/computers.html',});

列：

<script>angular.module('routingDemoApp', ['ngRoute']).config(['$routeProvider', function($routeProvider) {$routeProvider.when('/a', {templateUrl: 'one.html'}).when('/b', {templateUrl: 'zhuye.html'}).when('/c', {templateUrl: 'three.html'}).when('/d', {templateUrl: 'four.html'})}]);</script>

阅读全文

0 0

HTML 路由 换div

HTML 路由换div