AngularJS logic question


#1

Still trying to get my head around how the logic in AngularJS functions works.

Below is some Angular JS code that I am trying to understand

// Declare app level module which depends on filters, and services
angular.module('myApp', ['myApp.directives'])
    .controller('PasteController', ['$scope', function ($scope) {

    $scope.rawPaste = '';
    $scope.parsedPaste = [];

	var MyStrategy = function() {

	    this.pattern = function() {	    
	        return /[\n\f\r]/;
	    };

	    this.action = function(item, $scope){

    		return item.split("\t");
	    }

	    this.finish = function(item, $scope){
	    	console.log("finish", item);
	    	
	    }
	};

    $scope.StrategyA = function(){
    	return new MyStrategy();
    };

}]);

It is called by the following tag

<div ng-controller="PasteController" class="ng-scope">

    <angular-paste ng-model="rawPaste" ng-strategy="StrategyA()"/>
    
    <table class="table table-striped table-bordered">
        <tbody>

        <tr ng-show="parsedPaste.length==0">
            <td>Paste data onto this page using Ctrl + V</td>
        </tr>
        </tbody>
    </table>
</div>

Looking at the the tag I can see that it call the StrategyA() function.

The StrategyA() function then returns the result of the MyStrategy() function.

The MyStrategy() function then splits some pasted text based on a regular expression (I think).

My trying to understand what this MyStrategy() function is doing

  • It appears to set a pattern
  • Then with the this.action split the item based on \t, into I assume multiply items? Is the split("\t") splitting the lines based on a tab character?
  • It then runs this.finish to log the item.

I can’t see where the My Strategy() function actually returns values to the StrategyA() function. I’m assuming item is a $scope variable but cant see it anywhere.

Is someone able to give me a more detailed explanation of what the functions are doing.

Where does the item come from? Can seem to see it anywhere else in the code.

Brian


#2

Hi @bknott,

What it does is it allows you to feed the angular-paste directive with an object / function (MyStrategy()).

All the other variables that you see gets populated / updated by the directive. The object you feed into the directive gets consumed within it, that way, you can customize how it behaves at certain point.

Finally, it pushes or updates the final data into the finish function, from which you can then do further processing on your page.


Paul


#3

Hi @plim.

OK the step I missed was that the code actually contains a directive called Angular-paste.

I was looking at the code in the myApp controller and could not see what is was doing. Now I can see the .pattern, .action and .finish functions in the other directive.

Thanks

Brian