Javascript 错误：ng:areq参数错误，尝试在单独的文件中定义控制器

我的应用程序运行得很好，但我有一个巨大的app.js，所以为了模块化，我将控制器放入单独的文件中，并以更传统的方式设置我的应用程序。现在我得到了上面的错误：“参数‘prodPageCtrl’不是a”。这是我的prodPageCtrl

"use strict";
angular.module("app.products").controller('prodPageCtrl', function($scope, $http) {
//grid def / config
$scope.gridOptions = {
    enableFiltering: true,
    columnDefs : [
        {
            field: 'productId',
            name: 'View Product',
            cellTemplate: '<div class="ui-grid-cell-contents"><a data-ui-sref="app.products.readProductPage({productId: row.entity.productId})"><i class="fa fa-eye"></i> </a>'
        },
        {
            field: 'productId',
            name: 'Edit Product',
            cellTemplate: '<div class="ui-grid-cell-contents"><a data-ui-sref="app.products.editProductPage({productId: row.entity.productId})"><i class="fa fa-pencil-square-o"></i></a>' +
            '</div>',
        },
        {
            field: 'name'
        },
        {
            field: "upc"
        },
        {
            field: 'sku'
        },
        {
            field: 'mpn'
        },
        {
            field: 'productQty'
        },
        {
            field: 'unitOfMeasure'
        },
        {
            field: 'price'
        },
        {
            field: 'attribs'
        },
        {
            field: 'descript'
        }
    ]
};
//end grid options

$http.get("api/products")
    .then(function(response) {
        $scope.productArray = response.data;
        console.log(response.data);

        //parse JSON attributes string to objects TODO fix this by make attribute formatting better.
        for(var lcv = 0; lcv < $scope.productArray.length; lcv++) {
            $scope.productArray[lcv].attribs = JSON.parse($scope.productArray[lcv].attribs);
        }

        $scope.gridOptions.data = $scope.productArray; //put data into ui-grid

    });

});`

---

最后，有没有办法将模块的.config移到其他文件中，甚至整个模块声明中？进一步模块化。如果你知道我在哪里可以学到更多关于这个，请让我知道！感谢您

修复了使用GULP将我的所有js连接到构建文件夹中的问题

RTFM，首先是模块声明文件，然后是控制器文件，然后是配置文件。秩序很重要

angular.module('app.products', ['ui.router']);
angular.module('app.products').config(function ($stateProvider) {
$stateProvider
    .state('app.products', {
        abstract: true,
        data: {
            title: 'Products'
        }
    })
    .state('app.products.productPage', {
        url: '/products',
        data: {
            title: 'Products Page'
        },
        views: {
            "content@app": {
                templateUrl: 'products/views/products.html',
                controller: 'prodPageCtrl'
            }
        }

    })
    .state('app.products.addProductPage', {
        url: '/products/add',
        data: {
            title: 'Add a Product'
        },
        views: {
            "content@app": {
                templateUrl: 'app/app-views/views/AddProducts.html',
                controller: 'AddProdCntrl'
            }
        }
    })
    .state('app.products.readProductPage', {
        url: '/products/:productId',
        data: {
            title: 'View a Product'
        },
        views: {
            "content@app": {
                templateUrl: 'app/app-views/views/AddProducts.html',
                controller: 'readProdCntrl'
            }
        }
    })
    .state('app.products.editProductPage', {
        url: '/products/edit/:productId',
        data: {
            title: 'Edit a Product'
        },
        views: {
            "content@app": {
                templateUrl: 'app/app-views/views/AddProducts.html',
                controller: 'editProdCntrl'
            }
        }
    })
});