title: Angular JS controller and Factory in separate files
body: <p>Web development and Angular are completely new to me. I have created module , factory and controller in a same file (app.js). Below is the sample code</p>
  
  <pre><code>//Main Module
  var ipCharts = angular.module('ipCharts', []);
  
  //Factory
  ipCharts.factory('securityFactory', function ($http) {
      var securities = {};
      $http.get('api/Securities').
                                    success(function (data, status, headers, config) {
                                        securities = data;
                                    }).
                                    error(function (data, status, headers, config) {
                                        // log error
                                    });
  
      var factory = {};
      factory.getSecurities = function () {
          return securities;
      }
      return factory;
  });
  
  //Controller
  ipCharts.controller('securityController', function ($scope,securityFactory) {
      $scope.securities = securityFactory.getSecurities();
  }); 
  </code></pre>
  
  <p>I am wondering how module, factory and controller can be placed in separate files. </p>
  
  <p>I can place the controller  in a separate file when the controller is not making any reference to the factory. I cant get it working when controller using the factory and the factory is in a separate file. 
  Thanks</p>