javascript - Error: ng:areq Bad Argument when trying to define controllers in separate files -


my app worked great, had huge app.js, modularize put controllers separate files , set app in more conventional way. i'm getting error above along with: 'argument 'prodpagectrl' not a'. here 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 objects todo fix 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 ui-grid      });  });` 

here config in 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 product'         },         views: {             "content@app": {                 templateurl: 'app/app-views/views/addproducts.html',                 controller: 'addprodcntrl'             }         }     })     .state('app.products.readproductpage', {         url: '/products/:productid',         data: {             title: 'view product'         },         views: {             "content@app": {                 templateurl: 'app/app-views/views/addproducts.html',                 controller: 'readprodcntrl'             }         }     })     .state('app.products.editproductpage', {         url: '/products/edit/:productid',         data: {             title: 'edit product'         },         views: {             "content@app": {                 templateurl: 'app/app-views/views/addproducts.html',                 controller: 'editprodcntrl'             }         }     }) }); 

finally there way move .config modules other files, or whole module declaration? further modularize. if know can learn more please let me know! thank you

fixed using gulp conncat of js build folder


Comments

Popular posts from this blog

ruby - Trying to change last to "x"s to 23 -

jquery - Clone last and append item to closest class -

css - Can I use the :after pseudo-element on an input field? -