angularjs,编码风格,全局变量的使用

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

I see a lot of Angular codes more like this. The following one is from their tutorial.

我看到很多Angular代码更像这样。以下是他们的教程。

angular.module('phonecat', ['phonecatFilters', 'phonecatServices']).
  config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/phones', {templateUrl: 'partials/phone-list.html',   controller: PhoneListCtrl}).
      when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
      otherwise({redirectTo: '/phones'});
}]);

However, I am more familiar with like this;

但是,我对此比较熟悉;

var app = angular.module('phonecat', ['phonecatFilters', 'phonecatServices']);
app.config(function($routeProvider) {
  $routeProvider.
      when('/phones', {templateUrl: 'partials/phone-list.html',   controller: PhoneListCtrl}).
      when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
      otherwise({redirectTo: '/phones'});
}]);

I even want to define that function($routeProvider) { ...} as a variable, but I am not confident about that will work.

我甚至想要将该函数($ routeProvider){...}定义为变量,但我不相信这会起作用。

Is there a reason behind this to avoid global variable, in this case app.

这背后是否有理由避免全局变量,在本例中为app。

Or it's just one of best practices in AngularJs community?

或者它只是AngularJs社区的最佳实践之一?

2 个解决方案

#1


1  

angular.module(..) returns a module, and you can;

angular.module(..)返回一个模块,你可以;

  1. assign to a variable app(which is a global variable).
  2. 分配给变量app(这是一个全局变量)。

  3. or continue chaining it
  4. 或继续链接它

You saw a lot of chained examples because it is in a single file.

您看到了许多链接的示例,因为它位于单个文件中。

You will also see a lot of examples using global variable 'app' or whatever, because codes needs to be organized to many files.

您还将看到许多使用全局变量'app'或其他的示例,因为代码需要组织到许多文件中。

I recommend the first one if you make an single file example.
I recommend the second one if you make an actual app, which requires name spacing.

如果您制作单个文件示例,我建议使用第一个。如果您制作一个需要名称间距的实际应用程序,我建议使用第二个。

#2


1  

Namespacing is good. Best practive is using angular.value instead of global variables

命名空间很好。最好的实际是使用angular.value而不是全局变量

app.value('myVariable', 'myValue')
   .controller('myController', function($scope, myVariable) {
       ...
    }); 

#1


1  

angular.module(..) returns a module, and you can;

angular.module(..)返回一个模块,你可以;

  1. assign to a variable app(which is a global variable).
  2. 分配给变量app(这是一个全局变量)。

  3. or continue chaining it
  4. 或继续链接它

You saw a lot of chained examples because it is in a single file.

您看到了许多链接的示例,因为它位于单个文件中。

You will also see a lot of examples using global variable 'app' or whatever, because codes needs to be organized to many files.

您还将看到许多使用全局变量'app'或其他的示例,因为代码需要组织到许多文件中。

I recommend the first one if you make an single file example.
I recommend the second one if you make an actual app, which requires name spacing.

如果您制作单个文件示例,我建议使用第一个。如果您制作一个需要名称间距的实际应用程序,我建议使用第二个。

#2


1  

Namespacing is good. Best practive is using angular.value instead of global variables

命名空间很好。最好的实际是使用angular.value而不是全局变量

app.value('myVariable', 'myValue')
   .controller('myController', function($scope, myVariable) {
       ...
    });