写一段代码来解释吧!

<!DOCTYPE html>
<html ng-app="mainApp">
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div ng-view></div>
<script type="text/ng-template" id="template">
    <h1>{{title}}</h1>
</script>
<ul>
    <li><a href="#/a">A</a></li>
    <li><a href="#/b">B</a></li>
    <li><a href="#/c">C</a></li>
</ul>
</body>
<script src="angular.min.js" type="text/javascript"></script>
<script src="angular-route.min.js"></script>
<script>
    (function(angular){
        var app=angular.module('mainApp',['ngRoute']);
        //配置一个路由服务
        app.config(['$routeProvider', function($routeProvider) {
            $routeProvider
                    .when('/students/:name?', {controller: 'StudentsController',templateUrl: 'template'})
                    .when('/a',{controller:'controllerA',templateUrl:'template'})
                    .when('/b',{controller:'controllerB',templateUrl:'template'})
                    .when('/c',{controller:'controllerC',templateUrl:'template'})
                    .otherwise({redirectTo:'/a'});
        }]);
        app.controller('StudentsController',['$routeParams','$scope',function($routeParams,$scope){
            $scope.title=$routeParams['name']+'---hahhha';
            console.log($scope.title);
        }]);
        app.controller('controllerA',['$scope',function($scope){
            $scope.title='春天来了！！！';
        }]);
        app.controller('controllerB',['$scope',function($scope){
            $scope.title='夏天来了！！！';
        }]);
        app.controller('controllerC',['$scope',function($scope){
            $scope.title='秋天来了！！！';
        }]);
    })(angular)
</script>
</html>

angularjs里重要的route的更多相关文章

  1. 记项目中ES6+gulp+angularjs里的问题

    AngualrJs中可用来注入的有三种类型,service.factory.provider,这三种写法不样,用法也都不一样.其中,service只实例化一次,其实就是单例模式的思想.无论我们在什么地 ...

  2. angularjs里对JS的lowercase和uppercase的完善

    读angularjs的源码开头. var lowercase = function (string) { return isString(string) ? string.toLowerCase() ...

  3. 也说说angularJs里的evalAsync

    虽说angular都快出2.0了,到了2.0这些东东都会被干掉.不过我们眼前的事还是要处理. $evalAsync和$timeout到底什么区别,网上说法很多,最近看到的是说在directive里就怎 ...

  4. angularjs学习总结 详细教程（转载）

    1 前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,紧跟时代潮流,学习掌握新知识自然是不敢怠慢. AngularJS是google在维护,其在国外已经十分火热,可是国内的 ...

  5. [译]用AngularJS构建大型ASP.NET单页应用（二）

    原文地址:http://www.codeproject.com/Articles/808213/Developing-a-Large-Scale-Application-with-a-Single 客 ...

  6. [学习笔记] 七步从AngularJS菜鸟到专家（7）：Routing [转]

    这是＂AngularJS – 七步从菜鸟到专家＂系列的第七篇. 在第一篇,我们展示了如何开始搭建一个AngularaJS应用.在第四.五篇我们讨论了Angular内建的directives,上一篇了解 ...

  7. [转载]angularjs学习总结 详细教程

    http://blog.csdn.net/yy374864125/article/details/41349417#t75 目录(?)[-] 前言 AngularJS概述 AngularJS是什么 A ...

  8. angularjs学习总结(~~很详细的教程)

    1 前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,紧跟时代潮流,学习掌握新知识自然是不敢怠慢. AngularJS是google在维护,其在国外已经十分火热,可是国内的 ...

  9. 用angular来思考问题How do I “think in AngularJS” if I have a jQuery background?

    [翻译]How do I “think in AngularJS” if I have a jQuery background? 1. 不要先设计页面,然后再使用DOM操作来改变它的展现 在jQuer ...

随机推荐

  1. Spark名词解释及关系

    随着对spark的业务更深入,对spark的了解也越多,然而目前还处于知道的越多,不知道的更多阶段,当然这也是成长最快的阶段.这篇文章用作总结最近收集及理解的spark相关概念及其关系. 名词 dri ...

  2. css常用技巧集合

    1 不想让按钮touch时有蓝色的边框或半透明灰色遮罩(根据系统而定) /*解决方式一*/ -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-use ...

  3. sqlplus连接oracle问题

    第一次在自己电脑上连接远端数据库,尝试了一上午居然还没成功,后来在网上找了一堆的方法终于是连接上了    -_-!! 总结一下:简单操作:一步到位 我主要是用的oracle 11g的数据库,sqlpl ...

  4. maven的web项目手工发布

    网上有很多人都认为maven的web项目发布时,要用这个命令那个命令,太麻烦了,用纯手工打造发布更为方便. 第一步,导出你所在项目maven的依赖包. 打开cmd窗口执行命令:mvn dependen ...

  5. 使用Java注解来简化你的代码

         注解(Annotation)就是一种标签,可以插入到源代码中,我们的编译器可以对他们进行逻辑判断,或者我们可以自己写一个工具方法来读取我们源代码中的注解信息,从而实现某种操作.需要申明一点, ...

  6. ArrayList和List主要区别 就是ArrayList类型不安全。

    什么是不安全? 1:List大家都知道初始化的时候需要定义其类型,例如 List<int> listTest = new List<int>():而ArrayList,例如:A ...

  7. java swing组件的一些基本属性

    JLabel get/setText(): 获取/设置标签的文本. get/seticon(): 获取/设置标签的图片. get/setHorizontalAlignment(): 获取/设置文本的水 ...

  8. linux c socket笔记 -服务端

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <sys/types. ...

  9. 随应潮流-基于ABP+Angulsrjs现代化应用软件开发框架(1)-总体介绍

    前言 近几年一直从事电子政务和企业管理软件的外包开发工作,深感开发技术更新之快,尤其随着移动互联网的发展,前端技术发展更是一日千里. 现在随便一个项目都要求多端使用(PC+App+微信),如果没有一个 ...

  10. 利用WebLog Experet分析日志获取性能需求

    一.下载WebLog Expert日志分析工具 官网下载地址:http://www.weblogexpert.com/download.htm 二.安装 安装很简单,点击“下一步”默认安装即可 三.配 ...