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

选项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依赖项，即可在其他项目中重用控制器。

Answer 2

，它们都不会在生产环境中运行，所有脚本都将缩小。 Angular的注射器子系统能够查找并解析$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";
}]);

在这种情况下，控制器函数在每个依赖项的列表之后作为字符串文字在数组内部初始化。这样可以确保依赖注入得到适当维护，即使是通过缩小或丑化也是如此。

在angularJs中定义控制器的最佳方法

2 个答案: