前言
1、3種創建自定義服務的方式。
2、大家應該知道,AngularJS是后臺人員在工作之余發明的,他主要應用了后臺早就存在的分層思想。所以我們得了解下分層的作用,如果你是前端人員不了解什么是分層,那么你最好問問你后臺的小伙伴。
dao層:就是Model層,在后臺時,這一層的作用,就要是寫與數據庫交互數據的一層,在angularJS里就主要是寫ajax的。
service層:主查寫邏輯代碼的,但在angularJS里也可以持久化數據(充當數據容器),以供不同的controller高用。
controller層:即控制層,在angularJS里就是寫控制器的。控制器里盡量不要寫那些不必要的邏輯,盡量寫在service層里。
所以,就有了創建自定義服務的三種方式。
factory
factory方式創建的服務,作用就是返回一個有屬性有方法的對象。相當于:var f = myFactory();
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"> <p>{{r}}</p></div><script> //創建模型 var app = angular.module('myApp', []); //通過工廠模式創建自定義服務 app.factory('myFactory', function() { var service = {};//定義一個Object對象' service.name = "張三"; var age;//定義一個私有化的變量 //對私有屬性寫getter和setter方法 service.setAge = function(newAge){ age = newAge; } service.getAge = function(){ return age; } return service;//返回這個Object對象 }); //創建控制器 app.controller('myCtrl', function($scope, myFactory) { myFactory.setAge(20); $scope.r =myFactory.getAge(); alert(myFactory.name); });</script></body></html>在自定義服務里注入服務示例,但不能注入$scope作用域對象。
<script> var app = angular.module('myApp', []); app.factory('myFactory', function($http,$q) { var service = {}; service.name = "張三"; //請求數據 service.getData = function(){ var d = $q.defer(); $http.get("url")//讀取數據的函數。 .success(function(response) { d.resolve(response); }) .error(function(){ d.reject("error"); }); return d.promise; } return service; }); app.controller('myCtrl', function($scope, myFactory) { //alert(myFactory.name); myFactory.getData().then(function(data){ console.log(data);//正確時走這兒 },function(data){ alert(data)//錯誤時走這兒 });; });</script>service
通過service方式創建自定義服務,相當于new的一個對象:var s = new myService();,只要把屬性和方法添加到this上才可以在controller里調用。
新聞熱點
疑難解答
圖片精選