angularjs 装饰器 Decorator

最新推荐文章于 2024-09-01 07:06:16 发布

weixin_34051201

最新推荐文章于 2024-09-01 07:06:16 发布

阅读量263

点赞数

CC 4.0 BY-SA版权

文章标签： java javascript ViewUI

原文链接：https://yq.aliyun.com/articles/43261

本文介绍如何使用Angular的装饰器来为已有服务扩展新功能。通过一个具体的例子展示了如何为原有的Mail服务增加抄送功能，使得moduleA在依赖moduleB的情况下能够实现更丰富的邮件发送选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Decorator
装饰，在已有的功能上锦上添花
Use case 使用场景：

我有一个module A依赖于另外一个module B。 module B有个service Mail，这个服务提供两个方法setReceiver 和 setBody 分别用来指定邮件的收件人和邮件的内容。但是在module A 使用Mail服务的时候，我希望还可以指定抄送的人。这个时候我就可以在已有的service上扩展下（装饰下）加个addCC的方法。

Java代码  
var Mail = function() {  
    this.receiver = '';  
    this.body = '';  
    this.cc = [];  
};  
  
Mail.prototype.setReceiver = function(receiver) {  
    this.receiver = receiver;  
};  
  
Mail.prototype.setBody = function(body) {  
    this.body = body;  
};  
  
angular.module('A', []).service('Mail', Mail);  

Module B

Java代码  
angular.module('B', ['A']).config(function($provide) {  
    $provide.decorator('Mail', function($delegate) {  
        $delegate.addCC = function(cc) {  
            this.cc.push(cc);  
        };  
        return $delegate;  
    });  
})  
.controller('TestCtrl', function($scope, Mail) {  
    Mail.addCC('jack');  
    console.log(Mail);  
});  