标签: angularjs-decorator

我很好奇AngularJS中究竟是什么装饰者.除了AngularJS文档中的模糊以及YouTube视频中的简短(虽然有趣)之外,在线提供的信息并不多.

正如Angular家伙所说的那样,装饰者是:

服务的装饰,允许装饰者拦截服务实例的创建.返回的实例可以是原始实例,也可以是委托给原始实例的新实例.

我真的不知道这意味着什么,我不确定为什么要将这个逻辑与服务本身分开.例如,如果我想在不同条件下返回不同的东西,我会将不同的参数传递给相关函数或使用另一个共享该私有状态的函数.

我仍然是一个AngularJS菜鸟,所以我确定这只是我所捡到的无知和/或坏习惯.

我看到装饰器今天已经在一些javascript代码中使用了.我的问题实际上是双重的.

第一:

如果装饰者还没有最终确定如何在生产代码中使用它们呢？浏览器支持不会不存在吗？

第二:

鉴于今天有可能使用它,正如一些开源项目所暗示的那样,通常建议的设置是什么让装饰器工作？

我在Angular中有一个装饰器,它将扩展$ log服务的功能,我想测试它,但我没有看到这样做的方法.这是我的装饰者的存根:

angular.module('myApp')
  .config(function ($provide) {

    $provide.decorator('$log', ['$delegate', function($delegate) {
      var _debug = $delegate.debug;
      $delegate.debug = function() {
        var args = [].slice.call(arguments);

        // Do some custom stuff

        window.console.info('inside delegated method!');
        _debug.apply(null, args);
      };
      return $delegate
    }]);

  });

请注意,这基本上覆盖了该$log.debug()方法,然后在执行一些自定义操作后调用它.在我的应用程序中这是有效的,我'inside delegated method!'在控制台中看到了消息.但在我的测试中,我没有得到那个输出.

我该如何测试我的装饰器功能？
具体来说,我如何注入我的装饰器,以便它实际装饰我的$log模拟实现(见下文)？

这是我目前的测试(摩卡/柴,但这不是真正相关):

describe('Log Decorator', function () {
  var MockNativeLog;
  beforeEach(function() {
    MockNativeLog = {
      debug: chai.spy(function() { window.console.log("\nmock debug call\n"); })
    };
  });

  beforeEach(angular.mock.module('myApp'));

  beforeEach(function() {
    angular.mock.module(function ($provide) {
      $provide.value('$log', MockNativeLog);
    });
  }); …

我正在尝试为我的控制器设置一个装饰器.我的目的是介绍我的应用程序中所有控制器的一些常见行为.

我已经将它配置为在Angular 1.2.x中工作,但是从1.3.x开始有一些重大变化,这些更改破坏了代码.现在得到的错误是"控制器不是一个功能".

下面是装饰器的代码:

angular.module('myApp', ['ng'], function($provide) {
    $provide.decorator('$controller', function($delegate) {

        return function(constructor, locals) {

                //Custom behaviour code

                return $delegate(constructor, locals);
            }
        })
    });

Angular 1.2.x - http://jsfiddle.net/3v17w364/2/ (工作)
Angular 1.4.x - http://jsfiddle.net/tncquyxo/2/ (破碎)

当我的用户未经身份验证时,我试图避免使用角度js的模板错误.为此,我来到了这个stackoverflow解决方案.

它对我有用,但现在我注意到我的ng-animate停止工作而没有抛出控制台错误.

我错过了什么？

更新:这是使用的代码

var app = angular.module('app',[]);

app.config(['$provide', function($provide) {
  $provide.decorator('$templateRequest', ['$delegate', function($delegate) {
    var mySilentProvider = function(tpl, ignoreRequestError) {
      return $delegate(tpl, true);
    }
    return mySilentProvider;
  }]);
}]);

可以$templateCache在保持对原始提供者的引用的同时覆盖核心提供者吗？我想覆盖$templateCache不区分大小写。

IE 之类的

var normalGet = $templateCache.get;
var normalPut = $templateCache.put;
$templateCache.get = function(key) { normalGet(key.toLowerCase()); };
$templateCache.put = function(key,value) { normalPut(key.toLowerCase(), value); };

但不那么笨拙，更像 DI 风格？

我试图在$ exceptionHandler装饰器中处理错误,如下所示,

var app = angular.module('myApp',['toaster']);

app.config(function($provide){
  $provide.decorator('$exceptionHandler',function($delegate,toaster){
    toaster.pop('error','text','error');
    $delegate(exception, cause);
  });
});

这是傻瓜.这给了我以下错误,

Error: [$injector:cdep] Circular dependency found: $rootScope <- toaster <- $exceptionHandler <- $rootScope

我正在使用AngularJS-Toaster来显示错误.我现在如何在装饰器内注入烤面包机服务？