提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  工具

当前栏目

AngularJS--day07-路由跳转介绍

路由 -- 介绍 跳转 angularjs
2023-09-11 14:18:36 时间 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        /*
        1.router路由是angularJS中提出的，用于构建单页面应用的模块。
            描述：其本质是从a标签点击跳转功能延展而来的。
            说明：（1）router功能的实现需要依赖于angularJS的扩展库文件angular-route.min.js
            （2）router功能的实现需要依赖于ng-view指令
                【ng-view指令】的作用是提供标注[显示不同页面的容器]的作用
            (3)router功能的实现需要依赖于a 标签的href属性
                href='#要加载的页面代号'
                此属性设置的目的，是在a标签点击的时候能够通知路由，要加载哪一个页面
            (4)router 路由的具体语法是通过app页面数据模型创建的
                通过config方法来构建一个路由
                在路由中，通过.when()来判定加载哪一个页面
                在路由中，通过.otherwise()来决定路由默认加载哪一个页面
                
                app模型.config(['$routerProvider',function($routeProvider){
                    $routeProvider
                    .when('/页面代号'，{
                        templateUrl:'要加载的页面的url地址（以路由所在位置为起点）',
                        controller:'对应页面的控制器名称'
                        
                    })
                    ...
                    contherwise({
                        redirectTo:'/默认加载页面的代号'
                    });
                }]);
                
        注意：
            (1)    如果需要使用路由功能，那么在创建页面数据模型app的时候，
            必须要注入一条名为[ngRoute]的信息，此注入信息相当于对当前页面的声明：我要使用路由功能
            语法：var app = angular.module('app',['ngRoute']);
        */
    </body>
    
</html>

 

相关文章