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. Python3爬虫 利用百度地图api得到城市经纬度

    有2种方式,第一种是利用urllib , 方法1:利用urllib , 先把url 转成urlcode,然后读取网页,读到网页再用json读取内容,比较麻烦. 可以在浏览器输入,看一下格式. http ...

  2. [HAOI2018]染色

    嘟嘟嘟 这题当时没想出来(因为本人实在不太擅长计数),然后又被luogu的第一篇题解吓怕了,就咕了一小段时间再写. 其实这题不是很难. 做法就是基础容斥+NTT. 首先出现\(S\)次的颜色最多有\( ...

  3. 008_python内置语法

    一. 参考:http://www.runoob.com/python/python-built-in-functions.html (1)vars() 描述 vars() 函数返回对象object的属 ...

  4. AI 概率图模型

    概率图模型(Probabilistic Graphical Model) 有向图模型 信念网络 贝叶斯网络 无向模型 马尔科夫随机场 马尔科夫网络

  5. Java IO（四）——字符流

    一.字符流 字节流提供了处理任何类型输入/输出操作的功能(因为对于计算机而言,一切都是0和1,只需把数据以字节形式表示就够了),但它们不可以直接操作Unicode字符,因为一个Unicode字符占用2 ...

  6. UITextFieldDelegate 说明

    - (BOOL)textFieldShouldBeginEditing:(UITextField *)textField  // 返回YES,允许进行编辑 - (void)textFieldDidBe ...

  7. 使用Sharding-Proxy进行分库分表

    Sharding-Proxy的使用 1.官网下载 sharding-jdbc的官网http://shardingsphere.io/document/current/cn/manual/shardin ...

  8. IntelliJ IDEA（一） ：安装与破解

    前言 我是从eclipse转IDEA的,对于习惯了eclipse快捷键的我来说,转IDEA开始很不习惯,IDEA快捷键多,组合多,记不住,虽然可以设置使用eclipse的快捷键,但是总感觉怪怪的.开始 ...

  9. springcloud(十三)：Eureka 2.X 停止开发，但注册中心还有更多选择：Consul 使用详解

    在上个月我们知道 Eureka 2.X 遇到困难停止开发了,但其实对国内的用户影响甚小,一方面国内大都使用的是 Eureka 1.X 系列,另一方面 Spring Cloud 支持很多服务发现的软件, ...

  10. Item 26: 避免对universal引用进行重载

    本文翻译自<effective modern C++>,由于水平有限,故无法保证翻译完全正确,欢迎指出错误.谢谢! 博客已经迁移到这里啦 如果你需要写一个以名字作为参数,并记录下当前日期和 ...