• angular中自定义依赖注入的方法和decorator修饰


    自定义依赖注入的方法

    1.factory('name',function () {

      return function(){

        

      }

    });

    2.provider('name',function(){

      this.$get=function(){

        return function(){

        }

      };

    });

    3.service('name',function(){

      this.n=v;

    });

    4.constant('name','value');

    5value('name','value');

    依赖的继承   $delegate指的是当前的数据

    decorator('name',function($delegate){

      $delegata.a=12;

      return $delegate.a;

    });

    <!doctype html>
    <html ng-app="text">
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    <script src="angular.js"></script>
    <script>
    var app=angular.module('text',[]);
    //1>factory 最简单的方式,angular中实现方式相当于这里定义了,用的时候直接调用
    app.factory('sum',function(){
    	return function(num1,num2){
    		return num1+num2;
    	};	
    });
    app.controller('cont1',function($scope,sum){
    	alert(sum(12,5));
    });
    
    //2>provider 供应者,专门提供的,并且可以配置
    app.provider('formJson',function(){
    	//此处的this相当于在原生js中的构造函数中new provider
    	this.$get=function(){
    		return {
    			a:12,
    			b:5	
    		}
    	};	
    });
    app.controller('cont2',['$scope','formJson',function($scope,formJson){
    	console.log(formJson);	
    }]);
    
    //3>servier   服务   这种方法不用return 直接在servier上挂载即可
    app.service('dataText',function(){
    	this.showName='Jason';
    	this.showAge=18;	
    });   
    app.controller('cont3',['$scope','dataText',function($scope,dataText){
    	console.log('name:'+dataText.showName+';age:'+dataText.showAge);	
    }]);
    
    //4>constant  常量  不能修饰,也就是不能使用decorator的方法
    app.constant('wumai','1000');
    app.controller('cont4',['$scope','wumai',function($scope,wumai){
    	console.log('北京的PM2.5:'+wumai);	
    }]);
    
    //value  变量  可以修饰
    app.value('jiaozi','delicious');
    
    //decorator   angular中依赖是可以继承的,也就是装饰是可以继承的
    app.decorator('jiaozi',function($delegate){
    	$delegate.jiaozi='delicious!!!';
    	return $delegate;	
    });
    
    app.controller('cont5',['$scope','jiaozi',function($scope,jiaozi){
    	console.log('冬至的饺子:'+jiaozi);	
    }]);
    
    
    
    </script>
    </head>
    
    <body>
    	<div ng-controller="cont1"></div>
    	<div ng-controller="cont2"></div>
    	<div ng-controller="cont3"></div>
    	<div ng-controller="cont4"></div>
    	<div ng-controller="cont5"></div>
    </body>
    </html>
    

      

  • 相关阅读:
    Webpack的学习总结(1)
    mybatis-plus逻辑删除
    vscode编译调试C/C++多文件——linux(makefile)
    vscode配置调试C/C++程序——linux环境(命令行编译)
    shell编程题(二十二)
    shell编程题(二十三)
    shell编程题(二十一)
    shell编程题(二十)
    GTK开发视频播放器
    C语言实现LRU缓存(二)
  • 原文地址:https://www.cnblogs.com/jasonwang2y60/p/6209481.html
Copyright © 2020-2023  润新知