node - Controladores AngularJS y "uso estricto".

use strict node

Question

Recientemente comencé a usar JSHint y me exige que use la forma de la función de "uso estricto". Desde entonces, AngularJS lanza un error:

"Error: el argumento ''webAddressController'' no es una función, no está definido"

Cuando elimino la forma de la función de "uso estricto", el controlador se carga bien.

Controlador:

(function () {
    "use strict";

    function webAddressController($scope, $rootScope, web_address_service) {
             // Do things
    }

}());

¿Alguien tiene alguna idea de lo que está pasando aquí?

Answer 1

¿Has intentado escribir ''uso estricto'' fuera y antes? (Función ()

"use strict"; // <-- add it here
(function () {
    //"use strict"; <-- remove from here

    function webAddressController($scope, $rootScope, web_address_service) {
         // Do things
    }

}());

Mi respuesta se basa en los archivos que he visto generados por Yeoman

Answer 2

En primer lugar, quiero decir que pkozlowski realmente sabe lo que hace en Angular, pero en realidad esto no es tanto un problema Angular como un problema de cierre.

Angular está buscando controladores en dos lugares:

1. en su propio registro de controladores registrados a través de Module.controller ()
2. En una variable global (o declaración de función global)

El problema es que todo dentro de su cierre para "uso estricto" no es global. Está envuelto y privatizado en la función anónima que lo contiene.

(function() {
   // nothing in here is global or even public.
   // "use strict" or not.

   "use strict"; // this is mostly irrelevant.

   // this will not work, because it''s wrapped and not global
   function ThisDoesntWork($scope) {
   };

   // window is the global root variable. So this works.
   window.ThisWorks = function($scope) {

   };

   // this will work, because it''s explicitly registering the controller
   // presuming app is your Module variable from outside of the closure.
   app.controller(''ThisIsBest'', function($scope) {

   });

})();

//this works because it''s global.
function ThisAlsoWorks($scope) {

}

// if you declare a global var, then set it inside
// of your closure, you''re good to go too.
var ThisWillWorkToo;

(function {
    //here we''re setting it again.
    ThisWillWorkToo = function($scope) {
    };
})();


// if you''re really crazy you can even do this...
 var ThisWillWorkButItsWeird = (function() {
      "use strict";

       function ThisWillWorkButItsWeird($scope) {

       }

       return ThisWillWorkButItsWeird;
  })();

Al final del día, puede poner "uso estricto" dentro de cualquier función, o en el nivel de archivo si lo desea. El "uso estricto" en sí no está rompiendo nada para ti Hay mil formas de registrar un controlador, como puede ver. La mejor opción es probablemente registrarlos explícitamente con el método .controller como se sugiere.

Answer 3

Otra forma de hacer lo que @pkzolowski está haciendo si su módulo angular ya está cargado en otro lugar:

var app = angular.module(''myApp'');
app.controller(...);
app.service(...);
...

Se basa en el comentario de aquí: servicios de definición angularjs para el mismo módulo en diferentes archivos

Tenga en cuenta que el uso de angular.module (''myModule'', []) creará el módulo myModule y sobrescribirá cualquier módulo existente llamado myModule. Use angular.module (''myModule'') para recuperar un módulo existente.

Answer 4

Supongo que JSHint está tratando de decirle que aquí es evitar las variables globales (lo que obviamente es una muy buena práctica).

AngularJS tiene una opinión ligeramente diferente acerca de resolver el mismo problema (es decir, evitar las variables globales) y le permite definir los controladores en módulos (utilizando un espacio de nombres angular global). Puedes reescribir tu ejemplo usando módulos como este:

angular.module(''myApp'',[]).controller(''webAddressController'', function($scope) {
    // Do things
});

Aquí está el jsFiddle que ilustra esto en la práctica: http://jsfiddle.net/t3vBE/1/

Con este enfoque, no está contaminando el espacio de nombres global con los constructores de controladores.

Deberá cambiar la configuración de JSHint para permitir la variable global angular si desea usar el modo estricto. Alternativamente, también puede envolver todo su código (una vez más, usando módulos) en una función que se ejecuta de inmediato:

(function () {
    "use strict";

angular.module(''myApp'',[]).controller(''webAddressController'', function($scope) {

    $scope.name = ''World'';
    // Do things
});

}());​

Aquí está el jsFiddle: http://jsfiddle.net/t3vBE/4/

Para mí esto tiene sentido solo si desea definir JavaScript puro, funciones "auxiliares", de lo contrario me basaría en los servicios de AngularJS.