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 ...
随机推荐
- 冲刺一 (Day 3)
冲刺一 (Day 3) 用户表 uid int 8 用户ID username varchar 20 用户名 password varchar 20 密码 email varchar 30 邮箱 ph ...
- Struts2环境搭建
1,从http://struts.apache.org 官网下载struts2的源码,最新的源码是2.5版本的,但是考虑到网上2.3版本的教程比较多,所以我下载了一个2.3版本的struts. 2, ...
- High Memory in the Linux Kernel
This is enabled via the PAE (Physical Address Extension) extension of the PentiumPro processors. PAE ...
- 基于ADO.NET的SqlHelper类
1.使用Connection连接数据库的步骤: (1).添加命名空间 System.Data.SqlClient(注意:初学者经常会忘记) (2)定义连接字符串.连接SQL Server 数据库时: ...
- C语言中如何产生随机数
今天看到一段小程序 ,里面用到随机数.才发现在C语言中产生随机数不像matlab中那么简单. C中也有rand()函数,但是rand()函数产生的数不是真正意义上的随机数,是一个伪随机数,是根据一个数 ...
- java利用Aspose.cells.jar将本地excel文档转化成pdf(完美破解版 无水印 无中文乱码)
下载aspose-cells-8.5.2.jar包 http://pan.baidu.com/s/1kUBzsQ7 JAVA代码 package webViewer; import java.io.* ...
- discuz中方法
discuz中检验是否是邮箱 function isemail($email) { && strlen($email) <= && preg_match(&quo ...
- c#-基础:类的进阶
类的概述: 类是一个能存储数据并执行代码的数据结构 数据成员:通常模拟该类所表示显示世界的事物特性 函数成员:执行代码.模拟显示世界事物的功能和操作 数据成员:字段,常量 函数成员执行代码:方法 运算 ...
- 应用EF访问SQLite数据
创建项目,应用EF访问SQLite 1.创建项目 项目结构初始结构如下图所示,Netage.Data.SQLite 类库项目用于定义访问数据的接口和方法,Netage.SQLiteTest.UI 控制 ...
- shell 脚本杀死后台由php脚本控制运行的所有php脚本和java程序
效果: 运行命令: ./killallphpjavarm.sh java 源码: #!/bin/sh#根据进程名杀死进程#FileName: killjavaphprm.sh pgrep php ki ...