如何在单独文件中定义控制器

它具有这样定义的单个app模块：

var app = angular.module('app', ['ngAlertify', 'ngRoute', 'ui.bootstrap'])

我也有在单独*Ctrl.js -files定义几个控制器。什么是定义它们的适当方式？

我在这里看到两个选项。第一个是

app.controller('LoginCtrl', function($scope) { /* ... */ });

，第二个是

angular.module('app').controller('LoginCtrl', function($scope) { /* ... */ });

哪一个更好，最常见使用的做法？使用它们中的任何一个都有什么缺点？

来源

2017-02-24 FrozenHeart

'app'在其他文件中是如何访问的？ – tanmay

@tanmay我想'include'的顺序在这里很重要 – FrozenHeart

可能的重复[在angularJs中定义控制器的最佳方式]（http://stackoverflow.com/questions/32268718/best-way-of-defining -controller-in-angularjs） –

如果我理解你的问题正确，那么你宛在第一种方法应用就会知道

app.controller('LoginCtrl', function($scope) { /* ... */ });

angular.module('app').controller('LoginCtrl', function($scope) { /* ... */ });

之间的不同在以上两个是你app.js声明的地方，即一个全局对象像

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

在这种情况下app是一个全局变量，可在整个应用程序中访问。我认为在我们的应用程序中使用全局变量并不是一件好事。

在第二种方法中，我们使用全局angular对象来创建一个控制器，以便在此我们不会使用全局变量。在这种情况下app.js看起来像

(function(){ 
    'use strict'; 
    var app = angular.module('app', []); 
    .... 
    .... 
    .... 
    .... 
})

在这种情况下app变量将不可用此文件的任何地方分开。

所以我相信第二种方法比第一种更好。

来源

2017-02-24 10:37:35

所以第二种方法是'Browserify'的首选，对吧？ – FrozenHeart

是@FrozenHeart正确:) –

我个人的偏好是使用app.controller('LoginCtrl', function($scope) { /* ... */ });，因为这使得它更容易重用几乎没有其他项目没有变化控制器，没有那些恼人的module not found错误，因为你忘了重命名模块重用文件

来源

2017-02-24 10:22:47

我当认为这取决于个人的写作风格。一件事是，与AngularJS 1.XX工作时，你可以有不同的风格编写代码，方法中的层叠等

就个人而言，我更喜欢app.controller('LoginCtrl', function($scope) { /* ... */ });主要是因为你可以轻松地预览您的控制器和thge区别模块。我看到的明确定义的单独模块的另一个优点是，您可以轻松地检查包含您有哪些('ngAlertify', 'ngRoute', 'ui.bootstrap')。

迄今为止我所见过的最常用的即使在SO上也是我之前提到的方法。然而，这又是一种更能反映个人风格的东西，而不是强烈的写代码的先决条件。我希望这在一定程度上有所帮助。

来源

2017-02-24 10:26:50 ZombieChowder

以上都不是。模块的目的是保持应用程序模块化，不污染全球范围。

您可以有var app = ...但是这应该在每个文件中的IIFE内完成。

模块的另一个问题是优先级。如果应用程序使用angular.module('app')模块getter，则应按特定顺序加载文件，以便在其他文件中检索到模块时定义模块。这会产生问题，如果它们不是，例如当它们按字母顺序连接时。

解决方案是为每个文件使用一个模块。这使应用程序真正模块化，独立于文件加载顺序，也有利于可测试性。请参阅this answer了解此模式应如何工作。

来源

2017-02-24 10:34:35 estus

您可以使用模块设置器和getter方法来实现不同文件中的控制器。

假设myApp.module.js

angular.module('myApp', []); //Setter method, registring module

在myApp.homeCtrl.js

var myApp = angular.module('myApp'); // getter method, getting the module already registered. 
myApp.controller('homeCtrl', [function()]{ })

欲了解更多信息请检查您正在服用的是更好的这个https://toddmotto.com/angular-modules-setters-getters/

第二种方法，因为它使用已经建立的模块，并没有按不创建新模块，但使用第一种方法是使用不推荐的全局变量ed

来源

2017-02-24 10:45:08

如何在单独文件中定义控制器

回答

相关问题