angular之依赖注入

来源：互联网发布：体育视频直播软件编辑：程序博客网时间：2024/06/04 19:14
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>angualr test</title><link rel="shortcut icon" href="img/shortcut.png" /> <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><input type="number" ng-model="num"/></p><button ng-click="clcu()">clculate</button><p>number:{{num}}</p> <p>squere:{{result}}</p> </div><script>const app = angular.module("myApp",[]);//factory 是一个函数用于返回值。在 service 和 controller 需要时创建。//通常我们使用 factory 函数来计算或返回值。app.factory("clcuFactorys",function(){return {getResult:function(num){return num*num;}}})//AngularJS 中通过 provider 创建一个 service、factory等(配置阶段)。//Provider 中提供了一个 factory 方法 get()，它用于返回 value/service/factory。//config与factory同时存在且factory和provider同名时,config会覆盖factory。factory无效。app.config(function($provide){$provide.provider("clcuFactory",function(){this.$get = function(){return {getResult : function(num) {                    return num * num*num;                }}}})})app.value("append",1);//app.service回调函数的参数必须与app.factory保持一致app.service("clcuService",function(clcuFactory){this.clculate = function(num){return clcuFactory.getResult(num);}})//app.controller回调函数中的参数clcuService必须与app.service保持一致app.controller("myCtrl",function($scope,clcuService,append){$scope.result = null;$scope.clcu = function(){$scope.result = clcuService.clculate($scope.num)+append;}})</script></body></html>
0 0