ngRoute插件
angular中可以使用插件,例如ngRoute插件就是用与路由控制。
首先要在模块中引入即可:
var m1 = angular.module('myApp',['ngRoute']);
然后我们进行供应商配置
m1.config(['$routeProvider',function($routeProvider){
$routeProvider
.when('/aaa/:num',{
template : '<p>首页的内容</p>{{name}}',
controller : 'Aaa'
})
.when('/bbb',{
template : '<p>学员的内容</p>{{name}}',
controller : 'Bbb'
})
.when('/ccc',{
template : '<p>课程的内容</p>{{name}}',
controller : 'Ccc'
})
.otherwise({
redirectTo : '/aaa'
});
}]);
如上,通过when方法来制定不同的hash值对应不同的视图,hash只后面还可以带上参数num,
如何改变hash值?
1.可以通过a链接的href属性
2.通过$location.path()方法来改变
m1.controller('Aaa',['$scope','$location','$routeParams',function($scope,$location,$routeParams){
$scope.name = 'hello';
$scope.$location = $location;
console.log( $routeParams );
}]);
还可以在run方法中监听路由事件。
m1.run(['$rootScope',function($rootScope){
$rootScope.$on('$routeChangeStart',function(event,current,pre){
console.log(event);
console.log(current);
console.log(pre);
});
}]);
ngRoute插件的更多相关文章
- angularjs之插件ngRoute和ngAnimate
使用ngRoute和ngAnimate配合使用,可以实现页面切换的效果. 如果有使用过swiper,就知道这个效果是怎么样的. 代码: <!DOCTYPE html> <html l ...
- angularjs 路由 ngRoute tab切换
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...
- 转AngularJS路由插件
AngularJS学习笔记--002--Angular JS路由插件ui.router源码解析 标签: angular源码angularjs 2016-05-04 13:14 916人阅读 评论(0) ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- Jenkins 安装的HTML Publisher Plugin 插件无法展示ant生成的JunitReport报告
最近在做基于jenkins ant junit 的测试持续集成,单独ant junit生成的junitreport报告打开正常,使用Jenkins的HTML Publisher Plugin 插件无 ...
- 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)
前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...
- solr服务中集成IKAnalyzer中文分词器、集成dataimportHandler插件
昨天已经在Tomcat容器中成功的部署了solr全文检索引擎系统的服务:今天来分享一下solr服务在海量数据的网站中是如何实现数据的检索. 在solr服务中集成IKAnalyzer中文分词器的步骤: ...
- 使用Visual Studio SDK制作GLSL词法着色插件
使用Visual Studio SDK制作GLSL词法着色插件 我们在Visual Studio上开发OpenGL ES项目时,避免不了写Shader.这时在vs里直接编辑shader就会显得很方便. ...
- 工欲善其事,必先利其器 之 VS2013全攻略(安装,技巧,快捷键,插件)!
如有需要WPF工具的朋友可以移步 工欲善其事,必先利其器 之 WPF篇: 随着开发轨迹来看高效WPF开发的工具和技巧 之前一篇<c++的性能, c#的产能?!鱼和熊掌可以兼得,.NET NATI ...
随机推荐
- 表中排序ID断开重排
客户需要排序ID和页面的问题序号一致,以前删除过一些问题导致order_id 中间有些断开的. 业务表 T_QUESTION order_id question_id custom_id --1.创 ...
- 《循序渐进》之简单的DHCP实验
目的:初学,配置简单的DHCP试验. 试验步骤: 1:拓扑图 2:配置: Router>en Router#config t Enter configuration commands, one ...
- 高级php面试题(转)
一.mysql相关知识 1. mysql优化方式 MYSQL 优化常用方法 mysql 性能优化方案 2.如何分库分表 ...
- Java命令
java -classpath, 设定要搜索的类的路径,可以是目录,jar文件,zip文件(里面都是class文件),会覆盖掉所有的CLASSPATH的设定. 由于所要执行的类也是要搜索的类的一部分, ...
- 创建 Web 前端开发环境
Web 前端开发涉及多种工具,这里将常用工具的安装和配置进行说明,提供了详细的说明,为后继的开发创建一个坚实的基础. 本文介绍的工具有:NodeJS, NPM, Bower, Git 和 Grunt. ...
- JAVA类图
类与类图 类(Class)封装了数据和行为,是面向对象的重要组成部分,它是具有相同属性.操作.关系的对象集合的总称. 在系统中,每个类具有一定的职责,职责指的是类所担任的任务,即类要完成什么样的功能, ...
- SQL初级语法 [查询: SELECT]
SQL查询: SELECT 普通查询: SELECT "栏位名" FROM "表格名" DISTINCT 查询:(去掉重复) SELECT DISTINCT & ...
- Android_layout 布局(二)
昨天学习了layout 布局的线性布局和相对布局. 今天我们学习剩余的三个布局,分别是: 一.帧布局(FrameLayout) 在这个布局中,所有的子元素都不能被指定放置的位置,它们通通放于这块区域的 ...
- 初学c# -- 学习笔记(八)
RichTextBox我服了,背景透明.宽度高度自适应.图片背景透明.gif动画等等都tm实现困难无比,搞来搞去,就最后一题做不出来了: RichTextBox不管什么背景,透明背景也好,图片背景也罢 ...
- C++设计模式-策略模式(2)
策略模式:策略模式针对一组算法,将每一个算法封装到具有共同接口的独立的类中从而使得它们可以相互替换. 策略模式使得算法可以在不影响到客户端的情况下发生变化.策略模把行为和环境分开.环境类负责维持和查询 ...