Splitting a controller in 2 different files. Angular

Question

I am getting a headache trying to do this, I have a very big controller which I need to split, this controller has 177 lines already so I need 2 controllers. Once I try to split it my app breaks down.

Maybe you could help by giving suggestions on how to start and what I have to evaluate first. I am new to Angular and I thought it would be easier.

'use strict';

angular.module('capilleira.clickAndGambleMobile.controllers')
 .controller('LinesController', function($scope, $timeout, $state,
   $stateParams, $ionicLoading, $rootScope, LinesFactory, BetSlipFactory) {

    $scope.picksCount = false;

    var validateSanitizeLineParams = function() {
      var lineParamsOk = false;
      if (validator.isAlphanumeric($stateParams.customerId) &&
        validator.isNumeric($stateParams.familyGameId) &&
        validator.isNumeric($stateParams.games) &&
        validator.isNumeric($stateParams.top) &&
        validator.isNumeric($stateParams.sports) &&
        validator.isLength($stateParams.leagues.trim(), 1) &&
        validator.isAscii($stateParams.leagues.trim()) &&
        validator.isLength($stateParams.periods.trim(), 1) &&
        validator.isAscii($stateParams.periods.trim())) {
        lineParamsOk = true;
        _.each($stateParams.periods.split(','), function(periodId) {
          if (!validator.isAlpha(periodId)) {
            lineParamsOk = false;
          }
        });
        _.each($stateParams.leagues.split(','), function(leagueId) {
          if (!validator.isNumeric(leagueId)) {
            lineParamsOk = false;
          }
        });
      }
      return lineParamsOk;
    };

    $scope.lineItems = [];
    $rootScope.spinnerTitle = 'Loading lines';
    $ionicLoading.show({
      templateUrl: 'templates/loaders.html',
      scope: $rootScope
    });

    $scope.doRefresh = function() {
      if (validateSanitizeLineParams()) {
        LinesFactory.getLines($stateParams).then(function(linesPerLeague) {
          _.each(linesPerLeague, function(linesPerParent) {
            _.each(linesPerParent, function(lines) {
              _.each(lines, function(line) {
                _.each(line.rows, function(row) {
                  if (!row.noSpread) {
                    line.displaySpreadButton = true;
                  }
                  if (!row.noTotal) {
                    line.displayTotalButton = true;
                  }
                  if (!row.noMoneyLine) {
                    line.displayMoneyLineButton = true;
                  }
                });

                if (line.displaySpreadButton) {
                  line.displaySpread = true;
                } else if (line.displayTotalButton) {
                  line.displayTotal = true;
                } else if (line.displayMoneyLineButton) {
                  line.displayMoneyLine = true;
                }
              });
            });
          });
          $scope.lineItems = linesPerLeague;
          if (!$scope.lineItems[0].length) {
            $state.go('app.noLines');
          }
          $ionicLoading.hide();
          $scope.addLineSelections();
        }, function(err) {
          console.log(err);
          $rootScope.spinnerTitle = 'Wrong Params';
          $ionicLoading.show({
            templateUrl: 'templates/loaders.html',
            scope: $rootScope
          });
          $timeout(function() {
            $ionicLoading.hide();
            $state.go('app.login');
          }, 1500);
        });
      }else {
        $rootScope.spinnerTitle = 'Wrong Params';
        $ionicLoading.show({
          templateUrl: 'templates/loaders.html',
          scope: $rootScope
        });
        $timeout(function() {
          $ionicLoading.hide();
          $state.go('app.login');
        }, 1500);
      }
      $scope.$broadcast('scroll.refreshComplete');
    };
    $scope.doRefresh();

    $scope.showLine = function(lineType, line) {
      switch (lineType) {
        case 'spread':
          line.displayTotal = false;
          line.displayMoneyLine = false;
          line.displaySpread = false;
          $timeout(function() {
            line.displaySpread = true;
          }, 50);
          break;
        case 'total':
          line.displaySpread = false;
          line.displayMoneyLine = false;
          line.displayTotal = false;
          $timeout(function() {
            line.displayTotal = true;
          }, 50);
          break;
        case 'moneyline':
          line.displaySpread = false;
          line.displayTotal = false;
          line.displayMoneyLine = false;
          $timeout(function() {
            line.displayMoneyLine = true;
          }, 50);
          break;
      }
    };

    $scope.addLineToBetSlip = function(line, row, type) {
      var spreadSelected = (row.spreadSelected && type === 'spread'),
        totalSelected = (row.totalSelected && type === 'total'),
        moneyLineSelected = (row.moneyLineSelected && type === 'moneyline');
      if (spreadSelected || totalSelected || moneyLineSelected) {
        BetSlipFactory.remove(line, row, type);
      }else {
        BetSlipFactory.add(line, row, type);
      }
      $scope.picksCount = !$scope.picksCount;
    };

    $scope.addLineSelections = function() {
      BetSlipFactory.getBetSlip().then(function(betSlip) {
        var flattenLines = _.flatten($scope.lineItems),
          lineFound, row;

        _.each(betSlip, function(slip) {
          lineFound = _.find(flattenLines, function(line) {
            return line.gameId === slip.gameId &&
              line.part === slip.part &&
              line.lineTypeName === slip.lineTypeName;
          });
          if (lineFound) {
            row = _.find(lineFound.rows, function(row) {
              return row.nss === slip.nss;
            });
            if (row) {
              switch (slip.type) {
                case 'spread':
                  row.spreadSelected = true;
                  break;
                case 'total':
                  row.totalSelected = true;
                  break;
                case 'moneyline':
                  row.moneyLineSelected = true;
                  break;
              }
            }
          }
        });
      });
    };
  });

goreorto · Accepted Answer · 2015-02-14 00:04:20Z

1

This works as expected.

var app = angular.module('plunker', []);
var FatCtrl1 = function($scope){
  $scope.stuff1 = this.hello;

};
var FatCtrl2 = function($scope){
  $scope.stuff2 = "World";

};
app.controller('FatCtrl', function($scope) {
  this.hello = "Hello";
  FatCtrl1.apply(this, arguments);
  FatCtrl2.apply(this, arguments);
});

Beware of closures. Variables within FatCtrl are not available in the partitions. 'this' is used to share data.

answered Feb 14, 2015 at 0:04

goreorto

3022 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Splitting a controller in 2 different files. Angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related