angularjs - 如何解决角度模块未定义

Question

我在单独的文件中有四个控制器

1. 发票控件
2. 计费控制
3. 发票付款Ctrl
4. 发票视图控件

2, 3, 4 有这个angular.module('invoice.controller',[])

1 有这个angular.module('test',[])

在我的 app.js 中，我使用以下代码

angular.module('invoiceapp', ['invoice.controller','test','starter.services','ngDialog','angularMoment'])

现在每当我尝试用 2,3,4 更改 1 时

Argument 'InvoiceCtrl' is not a function, got undefined

我也尝试为每个控制器删除 angular.module 中的 []

任何人都知道如何解决这个问题

提前致谢 ！

PS 每个控制器都在一个单独的文件中。

billing.controller.js
payment.controller.js
invoice.controller.js
view.controller.js

angular.module('invoice.controller', [])

.controller('BillingCtrl', function($scope,$http,Dialogs,Invoices){

    $scope.status = 'Billing OK!';

});

angular.module('invoice.controller', [])

.controller('InvoicePaymentCtrl', function($scope,$http,Dialogs,Invoices){

    $scope.status = 'Invoice Payment OK!';

});

angular.module('invoice.controller', [])

.controller('InvoiceCtrl', function($scope,$http,Dialogs,Invoices){

    $scope.status = 'Invoice OK!';

});

angular.module('invoice.controller', [])

.controller('InvoiceViewCtrl', function($scope,$http,Dialogs,Invoices){

    $scope.status = 'Invoice View OK!';

});

Answer 1

你这样做的那一刻：

angular.module('invoice.controller', [])

您创建一个全新的模块，您可以省略后续的模块声明，只使用如下控制器：

// app.js file
angular.module('invoice.controller', [])

// File #1
angular.module('invoice.controller')
.controller('BillingCtrl', function($scope,$http,Dialogs,Invoices){

    $scope.status = 'Billing OK!';

})

// File #2
angular.module('invoice.controller')
.controller('InvoicePaymentCtrl', function($scope,$http,Dialogs,Invoices){
$scope.status = 'Invoice Payment OK!';
})

// File #3
angular.module('invoice.controller')
.controller('InvoiceCtrl', function($scope,$http,Dialogs,Invoices){
    $scope.status = 'Invoice OK!';
}) 

// File #4
angular.module('invoice.controller')
.controller('InvoiceViewCtrl', function($scope,$http,Dialogs,Invoices){
    $scope.status = 'Invoice View OK!';
});

注意到模块上缺少 [] 了吗？这是因为使用 [] 创建了应用程序本身的另一个实例 :)

Answer 2

这段代码：

angular.module('invoice.controller',[])

创建一个新模块。

在使用它们之前，您需要构建代码以创建一次模块。然后通过获取对之前创建的模块的引用来附加控制器：

var module = angular.module('invoice.controller');

我会这样做：

• 在 app.js 文件中，我会这样做：

  angular.module('invoice.controller',[]); angular.module('test',[]);

• 然后，在所有其他文件中，我将引用该模块

  var module = angular.module('invoice.controller'); module.controller('InvoiceCtrl',...)