錯誤：ng：areq Bad Argument嘗試在單獨文件中定義控制器

Question

我的應用工作得很好，但我有一個巨大的app.js，所以爲了模塊化，我將控制器放入單獨的文件中，並將其設置爲更傳統辦法。現在我得到了上面的錯誤：'參數'prodPageCtrl'不是'。這裏是我的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 

    }); 

});` 

這裏是我在我的app.js配置：

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' 
      } 
     } 
    }) 
}); 

最後是有移動的.config我模塊插入其他的文件，甚至是整個模塊的方式宣言？以進一步模塊化。如果您知道我可以在哪裏瞭解更多信息，請告訴我！謝謝

Answer 1

使用GULP我所有的JS的conncat到build文件夾