104 votes

Angularjs minimise les meilleures pratiques

Je suis en train de lire http://www.alexrothenberg.com/2013/02/11/the-magic-behind-angularjs-dependency-injection.htmlet il s'est avéré que angularjs l'injection de dépendance a des problèmes si vous rapetisser votre javascript alors je me demandais si au lieu de

var MyController = function($scope, $http) {
    $http.get('https://api.github.com/repos/angular/angular.js/commits')
      .success(function(commits) {
        $scope.commits = commits
      })
  }

vous devez utiliser

var MyController = ['$scope', '$http', function($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .success(function(commits) {
      $scope.commits = commits
    })
}]

dans l'ensemble je pensais que le deuxième extrait de code a été pour l'ancienne version de angularjs, mais ....

Dois-je toujours utiliser l'injecter façon (le deuxième) ?

104voto

Selvam Palanimalai Points 724

Oui toujours! Ainsi, même si votre minifer convertit $ scope en variable a et $ http en variable b, leur identité est toujours conservée dans les chaînes.

AngularJS docs -> http://docs.angularjs.org/tutorial/step_05 . Faites défiler jusqu'à une note sur la minification .

37voto

OZ_ Points 7398

Il est plus sûr d'utiliser la deuxième variante, mais il est également possible d'utiliser la première variante en toute sécurité avec ngmin .

METTRE À JOUR:
Maintenant, ng-annotate devient un nouvel outil par défaut pour résoudre ce problème.

8voto

dizel3d Points 156

Oui, vous avez besoin pour l'utilisation explicite de l'injection de dépendances (seconde variante). Mais depuis Angulaire 1.3.1 vous pouvez désactiver implicite de l'injection de dépendance, il est vraiment utile pour résoudre les problèmes potentiels avec le renommage à la fois (avant de minification).

La désactivation implicite DI, à l'aide de strictDi config de la propriété:

angular.bootstrap(document, ['myApp'], {
    strictDi: true
});

La désactivation implicite DI, à l'aide de ng-strict-di directive:

<html ng-app="myApp" ng-strict-di>

7voto

Whisher Points 1853

Juste pour signaler que si vous utilisez

Yeoman

il n'y a pas besoin de faire comme

 var MyController = ['$scope', '$http', function($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .success(function(commits) {
      $scope.commits = commits
    })
}]
 

Parce que grogner pendant minify prendre en compte comment gérer DI.

1voto

fxp Points 1360

Comme dit OZ_, utilisez ngmin pour minifier tous les fichiers js angulaires, comme directive.js service.js. Après cela, vous pouvez utiliser le compilateur Closure pour l’optimiser.

ref:

Comment réduire les scripts angularjs

Construire avec YO

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X