前面整理了AngularJs双向数据绑定和自定义指令的相关内容,从手册上看也知道,ng部分还包括过滤器和函数,以及服务等。

  过滤器:filter,就是对数据进行格式化,注意管道格式,例如:    

{{表达式 | number/currency/data/orderBy :  " 相应的格式或表达式 "}}

  函数:function,应该不用介绍了。这里需要注意的是forEach函数的形参顺序,基本格式如下:

 var obj={name:"fanfan",age:"20",gender:"female"};
 angular.forEach(obj,function(value,key){
     console.log(key+":"+value);});
 );

  服务:Angular services are singletons objects or functions that carry out specific tasks common to web apps.它是一个单例对象或函数,对外提供特定的功能。这也是我今天整理的重点。

  内置服务:ng提供了很多内置的服务,我们可以直接使用。 

  1.$scope/$rootScope

  首先我们要掌握的就是之前出现过的$scope,以及它的父级$rootScope。$scope/$rootScope都是ng内置的服务,服务的本质其实是一个对象

  如何使用:在控制器所对应的方法中注入进来 function($scope,$rootScope)

  $scope与$rootScope的关系/区别

  $rootScope是在ng启动时就会初始化一个对象,id为1;

  $scope是在调用控制器的方法时,注入过来的对象,id根据加载顺序向上递增,不同的控制器之间$scope数据时无法共享的,由于都是$rootScope的子元素,所以解决数据共享的问题,就是把数据放在$rootScope对象。实现控制器的嵌套,父元素中的模型数据是可以被子元素引用的。

  2.$http服务

  $http服务是AngularJS中的AJAX,其中$http中get和post方法(设置请求头app.run)的不同,数据序列化($.param)。

 app.run(function($http){
         $http.defaults.headers.post = {'Content-Type':'application/x-www-form-urlencoded'};//post方法需要的请求头设置
     });
 app.controller('fanCtrl', function ($scope,$http) {
 //       $http的get方法
 //        $http.get('data/server.php').success(function(data){
 //            console.log(data);
 //            $scope.list=data;
 //        })
 varobj={name:'Jerry',age:20};
 console.log($.param(obj));
         $scope.add=function(){
             $http.post('data/server2.php', $.param(obj)).success(function(data){
 console.log(data);
                 $scope.list=data;
             })
         }
     })

  自定义服务:

  1.factory 

 app.factory(‘服务名称’,function(){
     return {
          funcName:function(){}
   }
});
 6app.controller(‘myCtrl’,function($scope,服务器名称){
 7   服务器名称.funcName;
 8 });

  2.service

 app.service(‘服务器名称’,function(){
          this.变量名=值;
          this.方法名=function(){};
 })
 app.controller(‘myCtrl’,function($scope,服务器名称){
     服务器名称.funcName;
 });

factory和service的区别就是:factory里是普通的function,而service里是构造函数,在Angular中,调用service会用new关键字实例一个服务,而调用factory就是调用普通的function,所有factory可以返回任何的值,而service可以不返回。

  以上就是自定义服务的两种方法。还有几种常量定义的服务方法。constant/value  à创建的服务器返回一个常量。我们自定义的服务在依赖注入里再细说怎么使用。晚安

AngularJs学习笔记5——自定义服务的更多相关文章

  1. AngularJS学习---REST和自定义服务(REST and Custom Services) ngResource step 11

    1.切换目录 git checkout step- npm start 2.效果图 效果图和step 10的没有什么差别,这里主要的改动都是代码,代码做了很多优化,这里效果图就不再贴出来了. 3.实现 ...

  2. AngularJs学习笔记3——自定义指令

    指令 概述: 前面也说过一些常用指令,用于快速入门.现在详细总结一下:指令用于实现各种页面的操作,是对于底层DOM操作的封装,扩展了HTML的行为,实现页面交互以及数据绑定. 指令是一种执行的信号,一 ...

  3. AngularJS学习笔记(四) 自定义指令

    指令(directive)是啥?简单来说就是实现一定功能的XXX...之前一直用的ng-model,ng-click等等都是指令.当我有一个ng没提供的需求的时候,就可以自定义个指令.指令的好处显而易 ...

  4. AngularJs学习笔记--Forms

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...

  5. AngularJs学习笔记--html compiler

    原文再续,书接上回...依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler 一.总括 Angular的HTML compiler允许开发者自 ...

  6. AngularJs学习笔记--concepts(概念)

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...

  7. AngularJs学习笔记--Managing Service Dependencies

    原版地址:http://docs.angularjs.org/guide/dev_guide.services.managing_dependencies angular允许service将其他ser ...

  8. AngularJs学习笔记--Creating Services

    原版地址:http://docs.angularjs.org/guide/dev_guide.services.creating_services 虽然angular提供许多有用的service,在一 ...

  9. AngularJs学习笔记--I18n/L10n

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/i18n 一.I18n and L10n in AngularJS 1. 什么是I18n和L10n? 国 ...

随机推荐

  1. linux执行文件命令

    1.如果path中有你的程序所在的目录,那么直接执行filename即可 2.如果path中没有程序所在目录,那么进入目录./filename或者path/filename 比如 wj@ubuntu: ...

  2. Android学习手记(6) TabActivity和TabHost

    使用TabHost可以实现标签式效果,将两个Activity放在两个Tab内. 首先,需要基于MainActivity创建一个TabHost对象. TabHost tabHost = this.get ...

  3. MSSQL 简单练习回顾

    这段时间,报了浦软培训的.NET,现在整理回顾下,算是个小小总结吧 为了便于操作,我没有在多个数据库间切换数据库实例,以一个总的数据库实例 test_demo为源进行的相关操作,代码的注释根据我的理解 ...

  4. 我对Backbone中url属性的理解

    Model中有一个url属性,而且有一个urlRoot属性. Collection中也有一个url属性. // 这是Model中的url方法 url: function() { var base = ...

  5. 如何修改TextField的Label和EmptyText

    在需求中常常有修改form表单的标签和空文本提示,在渲染后组件有些字符固定下来 除非使用document进行原始修改,通过查询stackflow,我介绍更方便方法 模拟场景:点击ChangeLabel ...

  6. iOS 8 自动布局sizeclass和autolayout的基本使用

    1.首先创建新的工程,设置rootviewcontroller(这里不再多说) 2.勾选下面(因为我们到下面是使用sizeClass,所以勾选两个): 3.这里我创建了一个lable,名称为View1 ...

  7. 关于.net 对excel操作的方法

    asp.net打印文件用的最多的一般2种,word和excel,今天在这里整洁一下关于打印excel的几种方式及优缺点 第一种:直接打印html代码,然后将输出类型伪装成excel文件(excel是可 ...

  8. uva10020 贪心

    题目链接:https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem ...

  9. mysql 查询copy to tmp table造成堵塞

    show full PROCESSLIST; show VARIABLES like 'tmp_table_size' set GLOBAL tmp_table_size=629145600; SHO ...

  10. Phpcms V9全站伪静态设置方法

    为什么要伪静态?具体在这里就不说了,你懂的!一方面更新修改后不需要生成静态文件,另一方面为了SEO! 访问规则如下 1 2 list-{$catid}-{$page}.html content-{$c ...