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 ...
随机推荐
- js中array的filter用法
function bouncer(arr) { // Don't show a false ID to this bouncer. arr = arr.filter(function(val) { i ...
- linux 配置 tomcat 自动发布脚本
首先将打包好的 war 包(举例 management-20160809-1.0.war),传到 tomcat 的 webapps 目录下,然后在 tomcat 目录下新建 deploy.sh 脚本. ...
- 如何知道使用的是哪种shell?
命令一:[echo $0] 命令二:[echo $$]
- 开发《基于Arcgis Online的家政管理服务信息系统》随笔2
解决了三天的一个问题终于搞定了,和大家分享一下... 1.来点开胃菜, 在Sql server 2008中想要增加修改字段,有时不能修改,作如下操作即可搞定此问题, 启动MSSQL SERVER 2 ...
- kaggle& titanic代码
这两天报名参加了阿里天池的’公交线路客流预测‘赛,就顺便先把以前看的kaggle的titanic的训练赛代码在熟悉下数据的一些处理.题目根据titanic乘客的信息来预测乘客的生还情况.给了titan ...
- 『c++』 模板(template)--- 参数化多态性
---恢复内容开始--- 题外话: 模板机制的设计和细节是由Bjarne Stroustrup在其1988年10月发表的名为“Parameterized Types for C++”一文中披露的. 引 ...
- [JS]递归对象或数组
function recursive(obj) { var output = ''; if (typeof obj === 'object') { for (var key in obj) { var ...
- 44、NLP的其他分词功能测试
1. 命名实体识别功能测试 @Test public void testNer(){ if (NER.create("ltp_data/ner.model")<0) { Sy ...
- vim的树形菜单NERDTREE的设置
网上比较好的一篇文章:http://coolshell.cn/articles/1679.html http://coolshell.cn/articles/11312.html 1.Vim安装NER ...
- ArcEngine批量添加XY数据
使用ArcGIS Desktop “添加XY数据”或者“创建XY事件图层”工具 可以导入Excel坐标数据,生成临时图层并添加至ArcMap.ArcGlobe或者ArcScene中.在ArcEngin ...