Angularjs: Error: [ng:areq] Argument 'myAppCtrl' is not a function, got undefined when using routes with ngRoute and $routeProvider

Question

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

谢谢。

主要 html 文件片段：

//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>

Answer 1

你声明了 myApp 模块两次

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

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

只定义一次 mudule ，之后你可以像

一样访问它

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

进行这些更改。

Angularjs: Error: [ng:areq] Argument 'myAppCtrl' is not a function, got undefined when using routes with ngRoute and $routeProvider

Angularjs: Error: [ng:areq] Argument 'myAppCtrl' is not a function, got undefined when using routes with ngRoute and $routeProvider

javascript

runtime-error

angularjs

route-provider

ngroute