Angularjs：错误：[ng:areq] 参数 'myAppCtrl' 不是函数，在使用带有 ngRoute 和 $routeProvider 的路由时未定义答案

【问题标题】：Angularjs: Error: [ng:areq] Argument 'myAppCtrl' is not a function, got undefined when using routes with ngRoute and $routeProviderAngularjs：错误：[ng:areq] 参数 'myAppCtrl' 不是函数，在使用带有 ngRoute 和 $routeProvider 的路由时未定义
【发布时间】：2016-12-16 22:03:42
【问题描述】：

我在尝试在 2 个按钮上设置路由时遇到此错误。请帮助我找出出现此错误的原因，因为一切看起来都已到位并已定义。路线正在运行，但我没有在表中获得任何数据。我在主 htlm 中有：<html ng-app="myApp">，并且模块没有在任何地方重新定义。我查看了其他类似的帖子，但没有找到任何可以解决我的问题的内容。

谢谢。

主html文件sn-p：

//main controller mainCtrl.js:

angular.module("myApp", [])
.controller('myAppCtrl',['getStockData','corsService','$scope', function(getStockData ,corsService, $scope) {

        corsService.enableCors();
       getStockData.getData().then(function(data){

            $scope.products = data;
            console.log("hello from ctrl",data);
           });
    }])
    .controller('salesCtrl', function(getSalesData, $scope){
    getSalesData.getData().then(function(data){
        $scope.salesData = data;
        console.log(data);
    })
})
var app = angular.module("myApp");

//------------------------------------------------------------------------------
//route provider: routeProvider.js:

angular.module("myApp", ["ngRoute"])
    .config(function ($routeProvider) {
        $routeProvider.when("/products", {
            templateUrl: "views/productsView.html",
            // controller:"myAppCtrl"
        })
            .when("/sales", {
                templateUrl: "views/salesView.html",
            })
            .otherwise({
                templateUrl: "views/productsView.html",
                // controller: "myAppCtrl"
            });
    })

.controller("routeCtrl" ,function ($scope, $location){
    $scope.setRoute=function(route){
        $location.path(route);
    }
});

//---------------------------------------------------------------------------------
//getting the data getStockData.js:

app.service('getStockData', function($http){
    var dataUrl = "https://someAPI";
        return {
            getData: function() {
                var successCallback = function (response){
                    //the response object
                    console.log("the response object:", response);
                    return response.data;
                }
                var errorCallback =function (reason){
                    //the reason of error message
                    console.log("error", reason.data);
                    return reason.data;
                }
                //Returns a Promise that will be resolved
                // to a response object when the request succeeds or fails.
                return  $http.get(dataUrl)
                    .then(successCallback, errorCallback);
            }
        }
});

<body>

<div class="navbar navbar-inverse">
    <a class="navbar-brand" href="#">Beerbay</a>
</div>
<div ng-controller="routeCtrl" class="col-sm-1">
    <a ng-click="setRoute('products')"
       class="btn btn-block btn-primary btn-lg">Products</a>
    <a ng-click="setRoute('sales')"
       class="btn btn-block btn-primary btn-lg">Sales</a>
</div>

<ng-view />


</body>

<!--the partial view: productsView.html----------------------------------------->

<div class ="col-sm-11" ng-controller="myAppCtrl">
    <!--displaying the data-->
    <h4>Products</h4>
    <table id="product_table" class="table">
        <thead>
        <tr>
            <!-- table headers removed for brevity-->
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat = "item in products|orderBy: 'name'">

            <!-- table body removed for brevity-->
          <!-- here I am displaying the products from the $scope-->
        </tr>
        </tbody>
    </table>
    </div>

<!--the other partial view: salesView--------------------------------------------->

<body>
<p>This is the sales view</p>
</body>

【问题讨论】：

标签： javascript angularjs runtime-error ngroute route-provider

【解决方案1】：

你声明了两次 myApp 模块

1 ) angular.module("myApp", [])
2 ) angular.module("myApp", ["ngRoute"])

您在第一个模块上定义 myAppcontroller，然后再次声明相同的模块

只定义一次mudule，之后你可以像访问它一样

 var module = angular.module("myApp");

进行这些更改。

【讨论】：

是的，但是如果我在不同的文件中有路由配置，如何添加 ngRoute 依赖项。我会做这个改变。
你可以像这样添加依赖 var module = angular.module("myApp"); module.requires.push(''ngRoute")