AngularJS路由使用案例：

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>AngularJS路由使用案例</title>

         <script type="text/javascript" src="../js/angular.min.js"></script>

         <script type="text/javascript" src="../js/angular-route.min.js"></script>

     </head>

     <body ng-app="myapp">

         <div>

             <h1>在你我他学习吧，你可以学习到如下技术：</h1>

             <a href="#/JAVAEE"></a>

             <a href="#/AngularJS"></a>

             <a href="#/EasyUI"></a>

             <a href="#/MySQL"></a>

         </div>

         <!--路由加载后，更新变化的内容-->

         <div ng-view></div>

         <div>

             <h1>footer</h1>

         </div>

     </body>

     <script type="text/javascript">

         //定义myapp模块

         var myapp = angular.module("myapp",["ngRoute"]);

         //配置模块的路由

         myapp.config(["$routeProvider",function($routeProvider){

             $routeProvider.when('/JAVAEE',{

                 templateUrl:'javaee.html'

             }).when('/AngularJS',{

                 templateUrl:'angularjs.html'

             }).when('/EasyUI',{

                 templateUrl:'easyui.html'

             }).when('/MySQL',{

                 templateUrl:'mysql.html'

             }).otherwise({

                 redirectTo:'JAVAEE'

             });

         }]);

     </script>

 </html>

javaee.html代码：

<h1>javaee</h1>

angularjs.html代码：

<h1>angular</h1>

easyui.html代码：

<h1>easyui</h1>

mysql.html代码：

<h1>mysql</h1>

AngularJS路由使用案例的更多相关文章

  1. AngularJS 路由

    AngularJS 路由允许我们通过不同的 URL 访问不同的内容. 通过 AngularJS 可以实现多视图的单页Web应用(single page web application,SPA). 通常 ...

  2. Angularjs路由需要了解的那点事

    Angularjs路由需要了解的那点事 我们知道angularjs是特别适合单页面应用,为了通过单页面完成复杂的业务功能,势必需要能够从一个视图跳转到另外一个视图,也就是需要在单个页面里边加载不同的模 ...

  3. 【转】AngularJS路由和模板

    1. AngularJS路由介绍 AngularJS路由功能是一个纯前端的解决方案,与我们熟悉的后台路由不太一样.后台路由,通过不同的URL会路由到不同的控制器上(controller),再渲染(re ...

  4. AngularJS路由和模板

    前言 如果想开发一款类似gmail的web应用,我们怎么做呢? 以jQuery的思路,做响应式的架构设计时,我们要监听所有点击事件,通过事件函数触发我们加载数据,提交,弹框,验证等的功能:以 Angu ...

  5. AngularJS路由跳转

    AngularJS是一个javascript框架,通过AngularJS这个类库可以实现目前比较流行的单页面应用,AngularJS还具有双向数据绑定的特点,更加适应页面动态内容. 所谓单页面应用就是 ...

  6. AngularJS 路由精分

    AngularJS 路由机制是由ngRoute模块提供,它允许我们将视图分解成布局和模板视图,根据url变化动态的将模板视图加载到布局中,从而实现单页面应用的页面跳转功能. AngularJS 路由允 ...

  7. AngularJS进阶(二)AngularJS路由问题解决

    AngularJS路由问题解决 遇到了一个棘手的问题:点击优惠详情时总是跳转到药店详情页面中去.再加一层地址解决了,但是后来发现问题还是来了: Could not resolve 'yhDtlMain ...

  8. angularjs路由path方式实现原理探究

    angularjs路由 https://angular.io/guide/router 通过URL解释, 来定位客户端生成的浏览器端视图. 你可绑定路由到页面的链接上, 当用户点击链接, 可以浏览到相 ...

  9. AngularJS路由系列(6)-- UI-Router的嵌套State

    本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...

随机推荐

  1. UltraISO制作Ubuntu14.04 64bit到U盘文件载入不完整

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/zinss26914/article/details/37728251 前言 今天新买的Thinkpa ...

  2. [python] RRT快速拓展随机树

    """ version1.1,2018-05-09 <基于智能优化与RRT算法的无人机任务规划方法研究>博士论文 <基于改进人工势场法的路径规划算法研究 ...

  3. [SDOi2012]吊灯

    嘟嘟嘟 这题想了半天,搞出了一个\(O(10 * d * n)\)(\(d\)为\(n\)的约数个数)的贪心算法,就是能在子树内匹配就在子树内匹配,否则把没匹配的都交给父亲,看父亲能否匹配.交上去开了 ...

  4. day03-课堂笔记-大纲

    字典: # 字典循环: dic.keys() | dic.values() | dic.items()for k, v in dic.items():    print(k, v)        # ...

  5. tomcat配置通过域名直接访问项目首页步骤

    假设www.ctool.top.ip:192.168.122.135 step 1 申请一个域名并做好DNS解析,或者在hosts文件做域名指向 #vim /etc/hosts www.ctool.t ...

  6. falcon常用参数解析

    CPU.xxx cpu.idle cpu.idle表示除硬盘IO等待时间以外其它等待时间,这个值越大,表示cpu越空闲,还可以执行更多的任务,反之亦然,此处我们falcon展示的是idle的波动情况, ...

  7. 深入理解 ES6中的 Reflect

    阅读目录 一:Reflect.get(target, name, receiver) 二:Reflect.set(target,name,value,receiver) 三:Reflect.apply ...

  8. Generative Adversarial Nets[Improved GAN]

    0.背景 Tim Salimans等人认为之前的GANs虽然可以生成很好的样本,然而训练GAN本质是找到一个基于连续的,高维参数空间上的非凸游戏上的纳什平衡.然而不幸的是,寻找纳什平衡是一个十分困难的 ...

  9. UINavigationController - BNR

    继续上篇UITableView的编辑操作. 当你初始化一个UINavigationController对象时,它将拥有一个根视图控制器,即UIViewController.根视图控制器一直存在于sta ...

  10. UITableView 和 UITableViewController

    UITableView:显示有多行数据的一个列. 新建一个过程:Xcode -> File -> New -> Project...,然后选择iOS -> Applicatio ...