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 ...
随机推荐
- 裸奔Spring(1)
pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w ...
- PE新手教程
先确定你的手机是 IPhone 还是 Android Android 的在你的应用商店搜索 我的世界 下载 0.14.2 版本 , 也可以在群文件中下载 安装 然后点击 下载 等待下载.. 下 ...
- ASP.NET 表单验证实现浅析
首先,自然是配置 Web.config,在 <system.web> 下设定: <authentication mode="Forms"> <form ...
- Application、 session、iewstate,以及repeater 的commang用法
Session:在不同的浏览器之间传值,像银行之类的网站为了安全把用户名密码保存在session里面.每一台电脑访问服务器,都会是独立的一套session,key值都一样,但是内容都是不一样的 以 ...
- PCA降纬一步一步
import numpy as np 第一步:原始值 X1 0.9 2.4 1.2 0.5 0.3 1.8 0.5 0.3 2.5 1.3 X2 1 2.6 1.7 0.7 0.7 1.4 0.6 0 ...
- iOS7——UIControlEventTouchDown延迟响应问题
问题描述 在iOS7下开发,真机调试时,UIButton的其他事件响应都正常,但是UIControlEventTouchDown事件响应会延迟,而且不同响应区域发生的延时情况不同,有时延迟1s以后响应 ...
- 第一二九天上课 PHP 自制简单开发模板
构建基础架构 在项目文件夹(自定义)下创建 (1)核心目录:WQ (2)模板目录:MoBan (3)编译目录:BianYi (4)创建配置文件: config.ini.php <?php //获 ...
- WAP端 经验记录1
1. 点击元素触发事件的先后顺序:touchstart, touchend, mousedown, mouseup, click 2. Animate 的 stop 问题问题:手机端由于用 CSS3 ...
- linux 学习6 软件包安装
一.软件包管理简介 二.RPM包管理-rpm命令管理 三.RPM包管理-yum在线管理 四.源码包管理 五.脚本安装包与软件包选择 .软件包分类 源码包 脚本安装包 二进制包(RPM包.系统默认 ...
- EBS 消息总线
http://www.ibm.com/developerworks/cn/webservices/ws-whyesb/ 开发人员为何需要企业服务总线? 本文不仅仅是为架构师准备的:使用企业服务总线 ( ...