Angular: reusable function within a controller scope

Question

I need to inject some piece of code into a function, to prevent DRY. Here is an example of my code.

angular.module('crypt', ['ui.chart'])
.controller('MainCtrl', ['$http', function($http) {
  var self = this;
  self.encrypt = function() {
    $http.post('/encrypt',
             {'crypt': {'text': self.plain, 'shift':self.rot}})
    .then(function(response) {
      self.encrypted = response.data.encrypted;
      self.plain = '';
    // reusable function goes here
    // var frequencyArr = response.data.frequency;
    // var frequencyArrLength = frequencyArr.length;
    // if (frequencyArrLength) self.cryptChart = [frequencyArr];
    });
  };
  self.decrypt = function() {
    $http.post('/decrypt',
           {'crypt': {'text': self.encrypted, 'shift':self.rot}})
    .then(function(response) {
      self.plain = response.data.plain;
      self.encrypted = '';
      // and here 
      // the stuff to become a function
      var frequencyArr = response.data.frequency;
      var frequencyArrLength = frequencyArr.length;
      if (frequencyArrLength) self.cryptChart = [frequencyArr]; 
    });
  };
  // ...
}])

So how do I pack that 3 lines and make a reusable function in Angular way?

Miroslav Jonas · Accepted Answer · 2016-04-05 11:43:20Z

Maybe like this:

angular.module('crypt', ['ui.chart'])
.controller('MainCtrl', ['$http', function($http) {
  var self = this;

  function cryption(decrypt, callBack) {
    $http.post(
      decrypt ? '/decrypt' : '/encrypt', 
      {crypt: {text: decrypt ? self.encrypted : self.plain, shift: self.rot }})
    .then(callBack);
  }

  function cryptChart(response) {
    var frequencyArr = response.data.frequency;
    var frequencyArrLength = frequencyArr.length;
    if (frequencyArrLength) // can be simplyfied to response.data.frequency.length
      self.cryptChart = [frequencyArr];
  }

  self.encrypt = cryption(false, function(response) {
      self.encrypted = response.data.encrypted;
      self.plain = '';

      cryptChart(response);    
  });
  self.decrypt = cryption(true, function(response) {
      self.plain = response.data.plain;
      self.encrypted = '';

      cryptChart(response);
  });  
  // ...
}])

I went bit further and extracted the shared $http.post call into function as well.

Collectives™ on Stack Overflow

Angular: reusable function within a controller scope

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