AngularJS服务和路由
colnplie
网页加载的出现一次
link
元素每次改变的时候
**$watch**
监听列表
$scope.$watch("name",function(newVal,oldVal)){
console.log(newVal+""+oldVal)
新的值 旧的值
}
$digest
循环对象
在 $watch列表发生改变的时候,会发生循环。
循环的次数不能超过10次,否则,会程序发生错误!
$apply
会把$digest放在angular上下文里面(angular Canten)
作用域
子控制器范围可以找到父控制器的值,父控制无法找到子控制的值
原始类型
赋值的字符串或者数值叫做原始数据类型
数值、字符串、布尔值
引用类型
对象引用类型
angular服务
就是对外提供某个特定的功能。是一个独立的模块。
angular.module("myApp-service",[])
.factory("ajax",["$http",function(http){
return function(){
}
}]);
.factory("ajax",["$http",function(http)
ajax:是定义的服务的名字。
$http:是表示要使用到的angular的ajax。
angular.module("myApp-controller",[])
.controller("myController",function($scope,ajax) {
ajax({
});
})
下面的子模块就能够实现,使用自定义服务里面的功能。
angular路由
1、用iframe
iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。
2、ajax
jQuery load() 方法是简单但强大的 AJAX 方法。
$("#div1").load("demo_test.txt");
3、路由
同样实现无刷新的视图切换。
导入js文件:
angular-route.min.js
首先要定义主模块:
angular.module("mainApp",["ngRoute","mainApp.controller"])
ngRoute是angular里面的内置模块。
when
.config(["$routeProvider",function(provider){
provider.when("/p1",{templateUrl:"page1.html"});
provider.when("/p2",{templateUrl:"page2.html"});
网页
<ul>
<li><a href="#p1">页面1</a></li>
<li><a href="#p2">页面2</a></li>
</ul>
when //什么发生
通过点击li标签,来实现网页的切换。
otherwise
provider.otherwise({
redirectTo:"p2"
});
可用实现网页在加载的时候,出现的默认的网页。
AngularJS服务和路由的更多相关文章
- 前端MVC学习总结(三)——AngularJS服务、路由、内置API、jQueryLite
一.服务 AngularJS功能最基本的组件之一是服务(Service).服务为你的应用提供基于任务的功能.服务可以被视为重复使用的执行一个或多个相关任务的代码块. AngularJS服务是单例对象, ...
- 前端MVC学习笔记(三)——AngularJS服务、路由、内置API、jQueryLite
一.服务 AngularJS功能最基本的组件之一是服务(Service).服务为你的应用提供基于任务的功能.服务可以被视为重复使用的执行一个或多个相关任务的代码块. AngularJS服务是单例对象, ...
- AngularJS路由系列(4)-- UI-Router的$state服务、路由事件、获取路由参数
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router的$state服务● UI-Router的路由事件● UI-Router获取路由参数 Angular ...
- AngularJS学习---Routing(路由) & Multiple Views(多个视图) step 7
1.切换分支到step7,并启动项目 git checkout step- npm start 2.需求: 在步骤7之前,应用只给我们的用户提供了一个简单的界面(一张所有手机的列表),并且所有的模板代 ...
- [Angularjs]视图和路由(四)
写在前面 关于angularjs的路由的概念基本上这篇就要结束了,通过学习,以及在实际项目中的实践,还是比较容易上手的.自己也通过angularjs做了一个在app上的一个模块,效果还是可以的. 系列 ...
- [Angularjs]视图和路由(二)
写在前面 上篇文章主要介绍了视图和路由的基本概念,并在文章最后举了一个简单的使用案例.这篇文章将继续学习路由的配置,及相关参数的说明. 系列文章 [Angularjs]ng-select和ng-opt ...
- [Angularjs]视图和路由(三)
写在前面 上篇文章主要介绍了路由中when方法的第二个参数,常见的几个属性,以及作用.本篇文章,将介绍和路由相关的几个常见的服务. 系列文章 [Angularjs]ng-select和ng-optio ...
- Ⅲ.AngularJS的点点滴滴-- 路由
路由ngRoute (需要依赖ngRoute模块) <html> <script src="http://ajax.googleapis.com/ajax/libs/ang ...
- AngularJS 的嵌套路由 UI-Router
AngularJS 的嵌套路由 UI-Router 本篇文章翻译自:https://scotch.io/tutorials/angular-routing-using-ui-router 演示网站请查 ...
随机推荐
- DNA比对算法:BWT
DNA比对算法:BWT BWT算法,实质上是前缀树的一种实现.那么什么是前缀树呢? 一.前缀树 对于问题p in S?如果S=rpq,那么p为S前缀rp的一个后缀. 于是,为了判断p in S 是否成 ...
- 随笔-关于公网IP无法访问服务器的解决办法
笔者的环境: windows server 2008 r2 .IIS,php,MySql. 理论上来讲,服务器,其实就是一个大型计算机,我们通过访问服务器的某个端口请求某个资源. 正常情况下,如果没有 ...
- Hibernate参数绑定的五种方式
Hibernate参数绑定 参数绑定优点: (1)安全性 防止用户恶意输入条件和恶意调用存储过程 (2)提高性能 底层采用JDBC的PreparedStatement预定义sql功能,后期查询直接从缓 ...
- 【AngularJS中的自定义服务service VS factory VS provider】---它们的区别,你知道么?
在介绍AngularJS自定义服务之前,我们先来了解一下AngularJS~ 学过HTML的人都知道,HTML是一门很好的伪静态文本展示设计的声明式语言,但是,要构建WEB应用的话它就显得乏力了. 而 ...
- Reverse Integer 2015年6月23日
题目: Reverse digits of an integer. Example1: x = , return Example2: x = -, return - 思路:递归 解答: / test ...
- JVM、GC与HashMap
阿里巴巴突然来了个面试邀请电话,问了些java底层的东西,不知所措,所以专门花了些时间做了下学习,顺便记录下,好记性不如烂笔头. 一.对JAVA的垃圾回收机制(GC)的理解 不同于C/C++需要手工释 ...
- Linux常用网络测试命令
Linux常用网络测试命令 1. ifconfig 可以使用ifconfig命令来配置并查看网络接口的配置情况. 例如: (1) 配置eth0的IP地址, 同时激活该设备. #ifcon ...
- 【面向对象设计原则】之接口隔离原则(ISP)
接口隔离原则(Interface Segregation Principle, ISP):使用多个专门的接口,而不使用单一的总接口,即客户端不应该依赖那些它不需要的接口. 从接口隔离原则的定义可以看 ...
- JS 正则表达式否定匹配(正向前瞻)
引言:JS 正则表达式是 JS 学习过程中的一大难点,繁杂的匹配模式足以让人头大,不过其复杂性和其学习难度也赋予了它强大的功能.文章从 JS 正则表达式的正向前瞻说起,实现否定匹配的案例.本文适合有一 ...
- 一天搞定CSS(扩展):CSS Hack
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...