Лучший способ определения контроллера в angularJs

Question

Я новичок в angularJs. Я смущен тем, что лучший способ создать контроллер для ng-app="mainApp". При программировании других языков программирования, над которыми я работал, предлагаем сохранить относительные данные вместе. Но в angularJs считается лучшей практикой иметь новый модуль для контроллеров, когда мы можем определить контроллер над основным модулем приложения. Если мы создадим контроллер на mainApp, он будет поддерживать контроллер и связывать, что мы хотим на других языках.

var myapp = angular.module("mainApp", []); 
myapp.controller("testController", function($scope) 
{ 
    $scope.value = "test"; 
}) 

//OR 

angular.module("mainApp", ["moduleController"]); 
angular.module("moduleController", []).controller("testController", function($scope){ 
    $scope.value = "test"; 
}) 

Для условий производства, которые следует использовать. ??

Answer 1

Ни, ни один из них не будет работать в производственной среде, где весь скрипт будет минимизирован. Угловая подсистема инжектора может найти и разрешить $scope, $location, $etc и предоставить их компоненту по запросу.

myapp.controller("testController",function($scope) 
{ 
    $scope.value="test"; 
}) 

Однако при минификация, приведенный выше код будет в конечном итоге выглядеть примерно так:

a.controller("testController",function(b) 
{ 
    b.value="test"; 
}) 

, что вызывает зависимость инъекции, чтобы дать сбой и привести к ошибке во время выполнения.

Вы должны будете использовать его, как показано ниже:

var myapp=angular.module("mainApp",[]); 
myapp.controller("testController", ['$scope',function($scope) 
{ 
    $scope.value="test"; 
}]); 

В этом случае функция контроллер инициализируется внутри массива после списка каждой зависимости, как строковые литералы. Это гарантирует, что инъекция зависимостей должным образом поддерживается, даже путем минимизации или угашения.

Answer 2

Вариант 1:

var myapp = angular.module("mainApp",[]); 
myapp.controller("testController",function($scope) 
{ 
    $scope.value="test"; 
}) 

Вариант 2:

angular.module("mainApp", ["moduleController"]); 
angular.module("moduleController",[]).controller("testController",function($scope){ 
    $scope.value="test"; 
}) 

Вариант 2 лучше, потому что это позволит вам написать свои контроллеры в отдельных файлах. В результате ваш код будет более читабельным. Это также поможет вам, если вы хотите повторно использовать свои контроллеры в других проектах AngularJS.

Например, вы можете написать следующий код в одном файле, например app.js:

angular.module('mainApp',['ngRoute', 'appController']); 

И вы можете написать контроллер в другом файле, например controllers.js:

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

appController.controller('testController', ['$scope', 
    function($scope) { 
     $scope.value="test"; 
    } 
]); 

Теперь вы можете использовать контроллеры в другом проекте, просто добавив файл controllers.js в проект и добавив зависимость от appController в файле app.js.