如果可能的话,如何使momentjs不是Angularjs中的全局变量

时间:2022-01-29 19:35:53

I am confused when reading Angularjs style guide Y240.

阅读Angularjs风格指南Y240时我很困惑。

It talks about creating an Angular Constant for vendor libraries' global variables, so that we can inject vendor libraries that otherwise are globals.

它讨论了为供应商库的全局变量创建角度常量,以便我们可以注入原本为全局变量的供应商库。

My understanding is you have to do this:

我的理解是你必须这样做:

<script src="moment.js"></script>

before loading angular.js and controllers and directives in app.js, and moment object is a global variable. How do you use the following code to make it a service, and it can be injected when needed?

在app.js中加载angular.js和控制器和指令之前,moment对象是一个全局变量。如何使用以下代码使其成为服务,并在需要时注入?

Please correct me if I didn't see the full picture.

如果我没看到全貌,请纠正我。

// constants.js

/* global toastr:false, moment:false */
(function() {
    'use strict';

    angular
        .module('app.core')
        .constant('toastr', toastr)
        .constant('moment', moment);
})();

My confusion: Above code should make global variable 'moment' not global. Is this correct? I think it is impossible. moment is still global variable.

我的困惑:上面的代码应该使全局变量'时刻'不是全局的。它是否正确?我认为这是不可能的。时刻仍是全球变量。

2 个解决方案

#1


0  

To use a constant created that way in your AngularJS app:

要在AngularJS应用程序中使用以这种方式创建的常量:

//declare 'app.core' as a dependency
angular.module('myApp', ['app.core']);

//declare the constant in your injection list
angular.module('myApp').controller('myController', ['$scope', 'moment',
    function($scope,moment) {
        //use moment as you would normally
        var now = moment();
}]);

Update

更新

moment is still a global variable.

时刻仍然是一个全球变量。

The reason for doing this from John Papa:

John Papa这样做的原因是:

Why?: Provides a way to inject vendor libraries that otherwise are globals. This improves code testability by allowing you to more easily know what the dependencies of your components are (avoids leaky abstractions). It also allows you to mock these dependencies, where it makes sense.

为什么?:提供一种注入供应商库的方法,否则这些库是全局的。通过允许您更轻松地了解组件的依赖性(避免漏洞抽象),这可以提高代码可测试性。它还允许您在有意义的地方模拟这些依赖项。

https://github.com/johnpapa/angular-styleguide#style-y240

https://github.com/johnpapa/angular-styleguide#style-y240

#2


0  

I think maybe they only meant to load momentjs using

我想也许他们只是想加载momentjs

requirejs

requirejs

or

要么

browserify

browserify

So that when a lib is loaded, it is in a function(){} for local scope.

因此,当加载lib时,它位于本地范围的函数(){}中。

#1


0  

To use a constant created that way in your AngularJS app:

要在AngularJS应用程序中使用以这种方式创建的常量:

//declare 'app.core' as a dependency
angular.module('myApp', ['app.core']);

//declare the constant in your injection list
angular.module('myApp').controller('myController', ['$scope', 'moment',
    function($scope,moment) {
        //use moment as you would normally
        var now = moment();
}]);

Update

更新

moment is still a global variable.

时刻仍然是一个全球变量。

The reason for doing this from John Papa:

John Papa这样做的原因是:

Why?: Provides a way to inject vendor libraries that otherwise are globals. This improves code testability by allowing you to more easily know what the dependencies of your components are (avoids leaky abstractions). It also allows you to mock these dependencies, where it makes sense.

为什么?:提供一种注入供应商库的方法,否则这些库是全局的。通过允许您更轻松地了解组件的依赖性(避免漏洞抽象),这可以提高代码可测试性。它还允许您在有意义的地方模拟这些依赖项。

https://github.com/johnpapa/angular-styleguide#style-y240

https://github.com/johnpapa/angular-styleguide#style-y240

#2


0  

I think maybe they only meant to load momentjs using

我想也许他们只是想加载momentjs

requirejs

requirejs

or

要么

browserify

browserify

So that when a lib is loaded, it is in a function(){} for local scope.

因此,当加载lib时,它位于本地范围的函数(){}中。